Support Forums

Using divs instead of table columns on home page

This is a discussion on Using divs instead of table columns on home page within the Customizations forums, part of the Developer Forums category; I've been working on formatting the home page of my classifieds without using the table columns. This way each category ...


Go Back   68 Classifieds Forums > Developer Forums > Customizations

Reply
 
Thread Tools Display Modes
Old 08-18-2009, 07:42 PM   #1
Customer
 
Join Date: Aug 2008
Location: Canada
Posts: 66
Rep Power: 14
freeze2 is on a distinguished road
Default Using divs instead of table columns on home page

I've been working on formatting the home page of my classifieds without using the table columns. This way each category with subcategories can float in their own div...I'm finding this allows a cleaner look for what I'm after. I made the following change to the code on the home.tpl and was hoping someone could tell me if this is correct or needs some changes. It does look fine on the site.

HTML Code:
<table class="main" width="100%">
	<tr>
		<th>{$smarty.const.LANG_BROWSE_CATEGORY}</th>
	</tr>
	<tr>
		<td valign="top">
			{section name=tr loop=$data step=$cols}
				{section name=td start=$smarty.section.tr.index loop=$smarty.section.tr.index+$cols}
					<div class="categoryhome">
						{if $data[td]<>""}
							{$data[td].start_link}<img src="{$data[td].image}" border="0" alt="{$data[td].name}" /></a> 
							{$data[td].start_link}<strong>{$data[td].name}</strong></a>
							{if $data[td].total <> ''}
							({$data[td].total})
							{/if}
							{$data[td].subcats}
							{$data[td].description}
						{/if}
					</div>
				{/section}
			{/section}
		</td>
	</tr>
</table>
__________________
Developer-v4.1.5 | Customized Theme
freeze2 is offline   Reply With Quote
Old 08-19-2009, 02:30 PM   #2
68 Classifieds Staff
 
Eric Barnes's Avatar
 
Join Date: Mar 2006
Location: Belmont, NC
Posts: 5,489
Rep Power: 135
Eric Barnes is just really nice Eric Barnes is just really nice
Default

It looks correct to me. Just from glancing at it you may want to put the categoryhome div inside the if($data[td']) just incase it is blank. But I think that is required.
__________________
Eric Barnes
68 Classifieds Developer
Customer Area | Issue Tracker | Documentation | 68C Mods | 68 @ Twitter | My Modules
Eric Barnes is offline   Reply With Quote
Old 08-19-2009, 03:38 PM   #3
Customer
 
Join Date: Aug 2008
Location: Canada
Posts: 66
Rep Power: 14
freeze2 is on a distinguished road
Default

Thanks much!
__________________
Developer-v4.1.5 | Customized Theme
freeze2 is offline   Reply With Quote
Old 08-19-2009, 06:30 PM   #4
All Hands On Deck
 
 
Join Date: Mar 2008
Posts: 3,342
Rep Power: 84
seymourjames is a jewel in the rough
Default

The problem is does it look fine on various browsers. Does it validate as XHTML transitional The W3C Markup Validation Service. Posting a link would help to get more feedback.
__________________
"The fool doth think he is wise, but the wise man knows himself to be a fool.".

TemplateCodes.com for 68C, Version 4 Templates & Modules
Get the Best U.S Hosting, Best U.K Hosting
seymourjames is offline   Reply With Quote
Old 08-19-2009, 07:04 PM   #5
Customer
 
Join Date: Aug 2008
Location: Canada
Posts: 66
Rep Power: 14
freeze2 is on a distinguished road
Default

So far my testing shows good browser compatability and it does validate as XHTML transitional

Classifieds Site

I haven't finished yet...but getting there...
__________________
Developer-v4.1.5 | Customized Theme

Last edited by freeze2; 08-28-2009 at 10:46 PM.
freeze2 is offline   Reply With Quote
Old 08-19-2009, 07:18 PM   #6
All Hands On Deck
 
 
Join Date: Mar 2008
Posts: 3,342
Rep Power: 84
seymourjames is a jewel in the rough
Default

Looks good on Firefox and safari. It validates too XHTML transitional.
__________________
"The fool doth think he is wise, but the wise man knows himself to be a fool.".

TemplateCodes.com for 68C, Version 4 Templates & Modules
Get the Best U.S Hosting, Best U.K Hosting
seymourjames is offline   Reply With Quote
Old 08-19-2009, 07:27 PM   #7
Customer
 
Join Date: Aug 2008
Location: Canada
Posts: 66
Rep Power: 14
freeze2 is on a distinguished road
Default

Quote:
Originally Posted by seymourjames
Looks good on Firefox and safari.
Thanks...I hadn't tested on Safari.

I did have to add a "display: inline" to the main div to fix an ie6 float problem...but other than that I'm pleased with the outcome. One problem with using floating divs for the category layout is that you have to watch the order in which they are placed....you have to make sure to keep the categories with the most subcategories to the left to have them fall into place nicely...
__________________
Developer-v4.1.5 | Customized Theme
freeze2 is offline   Reply With Quote
Old 09-03-2009, 05:00 AM   #8
Junior Member
 
Join Date: Jul 2009
Posts: 24
Rep Power: 9
Hey Me is on a distinguished road
Default

Would be nice if added to the script by default or make it possible to edit from templates, not healthy to modify core files, it makes upgrades more complicated ..
Hey Me is offline   Reply With Quote
Old 09-03-2009, 06:34 AM   #9
Staff
 
Join Date: Mar 2006
Posts: 587
Rep Power: 34
Blair will become famous soon enough
Default

Quote:
Originally Posted by Hey Me
Would be nice if added to the script by default or make it possible to edit from templates, not healthy to modify core files, it makes upgrades more complicated ..
Typically, you don't have to overwrite files located in the templates folder during an upgrade.
__________________
Blair
68C Staff

68C Downloads | Report a Bug | Knowledge Base
If you have a current support subscription, you can Submit a Support Ticket
Blair is offline   Reply With Quote
Old 09-03-2009, 08:42 AM   #10
All Hands On Deck
 
 
Join Date: Mar 2008
Posts: 3,342
Rep Power: 84
seymourjames is a jewel in the rough
Default

It is not a core file. He is putting this in a template folder - home.tpl . By all accounts you should copy the default template folder when you first install and call it something else. You then modify this new template folder with peace of mind. The documentation on how templates work is pretty clear. If a file exists in your new template folder it will be used but if it does not exist it will default to the DEFAULT. This way if you make a real hash of things you simply delete your version of the template file and it will pick up the default and bring you back to normal.
__________________
"The fool doth think he is wise, but the wise man knows himself to be a fool.".

TemplateCodes.com for 68C, Version 4 Templates & Modules
Get the Best U.S Hosting, Best U.K Hosting
seymourjames is offline   Reply With Quote
Reply

Thread Tools
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Problem with divs martini55 Templates, HTML, CSS, and Design Help 5 06-15-2009 01:44 PM
placing a video on my about us page or the home page?? apotrader Technical Support 4 11-04-2008 10:11 PM
Control width of table columns in category table domino Templates, HTML, CSS, and Design Help 2 09-07-2008 08:37 AM
Adding Feature Item Table to HTML Page art Templates, HTML, CSS, and Design Help 11 08-05-2006 03:10 AM


All times are GMT -4. The time now is 12:18 AM.


Powered by vBulletin® Version 3.8.1
Copyright ©2000 - 2011, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.2.0