Week Twelve (MGDP2060)
From Wiki @ Karl Jones dot com
Revision as of 18:26, 19 November 2015 by Karl Jones (Talk | contribs) (→Exercise for next class session)
This article lists topics for Week Twelve of Web Design and Development III (MGDP2060).
NO CLASS NEXT WEEK. Have a happy Thanksgiving.
In the news
- Don't copy-paste terminal commands from the web - "tl;dr: whatever Javascript put into your clipboard gets run irrespective of what you thought you were copying, and the outcomes can be exceedingly unpleasant."
WordPress custom theme example
style.css
The style.css file contains:
- A comment which tells WordPress that this style sheet represents a theme.
- Your CSS styles
- Bootstrap styles first
- Custom styles second
header.php
The header.php file contains HTML that is shared by all pages.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Description here">
<meta name="keywords" content="Your keywords">
<meta name="author" content="author name">
<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="screen" />
<?php
if ( is_home() ) {
$title = 'Home : Classroom Example!!!';
} else {
$title = 'Other Page : Classroom Example';
}
?>
<title><?php echo $title; ?></title>
</head>
<body>
index.php
The index.php file contains the HTML for the main body of pages.
Example:
<?php
get_header();
?>
<div class="container main home">
<h1>Content goes here</h1>
<div class="overlay top-overlay">
<p>Image needs special path in WordPress template</p>
<img src="<?php echo get_template_directory_uri(); ?>/images/test.png" class="img-responsive" alt="" />
</div>
<?php the_content('Read more...'); ?>
</div>
<?php
get_footer();
?>
footer.php
The footer.php file contains shared footer information, such as copyright and legal statements.
Example:
<footer class="container bottombar">
Footer info goes here
</footer>
</body>
</html>
NO CLASS NEXT WEEK
Have a happy Thanksgiving.
