Editing the main.tpl

[Anonymous]

Great script.. I tried all of them and this is by far the most funictional and easy to user.

I was wondering if anyone could fill me in on how to customize the presentation of the main.tpl. That is, I'd like to center the category list and change a couple other things.

[seothatworks]

Content visible to registered users only.

Like any html, I believe (I was doing just very minor changes myself, so not sure if there is not a catch somewhere), you just need to read between the smarty tags.

[Anonymous]

I'm no css guy and am trying to figure how to center everything and reduce the top.tpl search bar to 800 pixels.

Thanks

[kickass]

In main.css which resides in the root directory of the script look for #path -- I'm pretty sure that's the section you're talking about. You can adjust it by adding the line:

width: 800px;

You can also make adjustments to the width of the search form by playing with .text and .btn , which control the styling of the searchbox text input and button respectively.

[Anonymous]

Finally getting a feel for this....

Two last questions if i may:

take a look to see what i'm talking about

{unrelated demo link removed}

How can i center the top search bar?

And, how can i add a table (html) code to the footer?

Thanks again

[Mike77]

I think inserting table is easy in footer.tpl .Just insert some html table code after the phplinkdirectory.com link there.

[kickass]

Try adding the following to that same bit of css that you made 800 wide:

margin: 0 auto;
text-align: center;

further info about using css to center stuff can be found here:
http://css-discuss.incutio.com/?page=CenteringBlockElement

And I'm not the one to ask about how to add tables- I'm the one who rips 'em out by the roots! If you wanna tell me what you want to do in the footer I'll be happy to tell you how to do it without using a table. I've gotten quite good at it:
http://kickasswebdesign.com/webgeekdir/

[Anonymous]

Much appreciated

[Anonymous]

OK I'm stuck. I have been trying to sort out a centered layout for my directory to try and achieve the same sort of layout as some of the other directories mentioned here. I must confess that design is not my strong point so css and smarty are both new to me. I have made the changes to the CSS mentioned in this thread expecting to get a directory roughly in the centre of the page with a width of 800px. In fact what I get is just the title bar in the right place with all of the content still as before. The #path section of the css is as follows:

margin: 0 auto;
text-align: left;
margin-top: 2px;
padding: 2px;
background: #DDE2EC;
line-height: 19px;
border-top: 1px solid #5e74b3;
border-bottom: 1px solid #5e74b3;
width: 800px;

My site is at {broken link removed}

I can edit the header, footer and main template files and centre the content. This almost gives me the required output except that the links themselves are then centered rather than been left aligned in the 800px box in the center.

If anyone can give me any pointers on this I would be very greatful.

Thanks

Mark

[Ap0s7le]

Hello Mark,

In the body { } of the main.css add your width and margins like so.

Content visible to registered users only.

Should handle your problem nicely.

-Casey

[kickass]

You have to wrap it all in a nice package and then center the package. This is the css that goes in main.css in the top level directory:

Content visible to registered users only.

Now, in the templates directory you need to open two files, header.tpl and footer.tpl

In header.tpl add this code right after the body tag:

Content visible to registered users only.

Now in footer.tpl add this right BEFORE the /body tag:

Content visible to registered users only.

That SHOULD do it. You sometimes have to add position:relative; to the mainwrapper to get it to behave. Also, the text-align:center; in the mainwrapper has to be there for IE5 BUT it centers ALL text within it unless you get specific in other places. What that means is that you should define text-align: left; in other divs and elements that are contained WITHIN the mainwrapper.

[Anonymous]

Thanks. That seems to have solved it. Got things centered properly. Now just need to work on a nice design!

Mark

[richm]

This thread has been very helpful. I was able to successfully reduce the width of the site by adding a width: 738px; line to the body section of the main.css file.

However, I am having another problem that may be related to sizing and wrapping. When I first display a list of links, about 10% of them don't line up with the left margin. It appears that the longer the description, the worse the problem is. However, some long ones have no problem at all.

Please click on the link below.
http://www.chefsblogs.com/directory/index.php?s=A&c=75

When a directory loads fresh from the browser, it loads properly. However, if you click through the menus to get there, about 10% of the entries are misaligned (scroll down and you will see this). The easiest way to see this is to click on the sort by "alpha" or "hits" link. It will resort and display incorrectly. If you hit refresh in the IE browser, it fixes it.

Any ideas? Could this be related to my resizing in the body section? I tried searching for another thread that addresses this, but could not find one.

[kickass]

I'm not seeing what you're seeing, so I can't suggest a fix. I will say this- sometimes problems in IE are a result of local browser settings (ones on your machine) or monitor/screen resolution, instead of browser rendering. I don't know this to be the case, but it is possible, if others are not seeing what you are.

One way you can test is to try this on other machines. If you get the problem on some machines, then yes, it's possibly an IE problem OR a combination of local settings and IE rendering. If you don't get the problem on any machine but yours, then it's a local setting problem.

If it is an IE problem it's possible you can find the solution here:
CSS Browser Bugs (http://kickasswebdesign.com/webgeekdir/CSS/Browser_Bugs/)

[richm]

Thanks, you are correct. It is a browser problem. The problem does not happen with FireFox, and it does not happen on with IE a pristine machine (my laptop). I went through your suggested link, and didn't find much on how my IE might be setup wrong (most of it was about how to modify css code to deal with inherent IE problems).

This might become more urgent for me when I start hearing from users who see the same thing. It it is just me, I can live with it.