December 2009
Beginner
416 pages
9h 53m
English
Content preview from Using Joomla
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
Preparing the HTML and CSS
Now that we’ve determined the structure of our pages, let’s take a look at the structure itself, shown in Figure 17-2.
Figure 17-2. Joomla Pet Center home page zones
There are plenty of philosophies on how you’d code a page in HTML and this isn’t the right book to explain that. However, it’s always a good practice to use CSS and separate your page structure markup from your presentation markup. Using our previous structure, we start by creating a simple PHP file containing a DIV for each zone, which might look like:
<html>
<head>My test page</head>
<body>
<div id="container">
<div id="header">This is where my header will go</div>
<div id="main-menu">This is where my main menu will go</div>
<div id="content-area">This is where my content area will go</div>
<div id="second-menu">This is where my secondary menu will go</div>
<div id="login">This is where my login box will go</div>
<div id="footer">This is where my footer will go</div>
</div>
</body>
</html>There’s an outer DIV “container” added there to enclose all of the zones marked by their own DIVs. Now, create a stylesheet (often named template.css) and add styles for each of those DIVs. For example:
#container {width: 900px;]
#main-menu (width: 200px;}
#content-area {width:700px;}
#login {width 200px;}While this CSS code is only the beginning of your design, it defines the widths of the DIVs to match the ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.