Page Formatting Issues


Author Message
JReese

Posted: 9/7/2009
Quote message 

I have been using Artisteer for about a month and a half and after trying it for a few weeks I quickly purchased it after realizing how it drastically improves the speed of making a design that I am happy with versus just dealing with another free template that I can download.

After working for a bit through a couple revisions of my own theme for Wordpress I am finally close but now that I am starting to add content to pages on my Wordpress install there are severe formatting issues with my Artisteer theme that does not exist on either the stock theme or any free theme that I download. The page looks fine on those but looks like garbage with my Artisteer theme.

There should be sections there with an image starting each and then the paragraph beside each image and a bulleted item below. Very nicely organized.

How do I troubleshoot this problem with my Artisteer template? I am assuming it is a CSS issue but I don't have enough experience to see what is the problem.

This is my Contact page with my current Artisteer theme:
http://wp.reesecomputing.com/contact/

And this is a screenshot of my Contact page with a free downloaded theme that works fine.
http://wp.reesecomputing.com/wp-content/uploads/2009/09/freethemess.png
 
Garry

Posted: 9/7/2009
Quote message 

It seems to be an editor issue, in your contact page you are placing your itema as following:

<ul>
<li> Item1</li>
</ul>
<p> your image and other text</p>

<ul>
<li> Item1</li>
</ul>
<p> your image and other text</p>
===================================
But it should be like:

<ul>
<li> <p> your first image and other text</p></li>
<li> <p> your second image and other text</p></li>
<li> <p> your third image and other text</p></li>
</ul>
 
JReese

Posted: 9/8/2009
Quote message 

But using the corrected code you posted makes the image and paragraph of text a bulleted item which is not what I want. I only want the linked text like "Send a General Email" to be a bulleted item.

The image should be left aligned with the text AND the bulleted item flowing beside it. The bullet should not be in the middle of the image and the next image should not appear where it is showing like it is nested under the preceding one.

Like I said my current code works fine with the default theme and any other theme that I download but it is ridiculously messy with my Artisteer theme; as seen on the live Wordpress site.
 
JReese

Posted: 9/8/2009
Quote message 

Well after a few hours of testing tonight I did manage to solve some of the issues with the layout but the issue still remains with the bulleted items not being aligned with the actual item. It looks like formatting is somehow not being applied to it and instead it just stays left aligned at the side of the page. But again it works find in the default theme and any downloaded theme; but not my Artisteer theme.
 
Bud

Posted: 9/9/2009
Quote message 

On line 1167 of your style.css try changing the left margin value to something like 11em and see what happens.

I've had the same problem from time to time. Artisteer just doesn't give you enough control over the bullet margins.

This change will probably affect the bullets in other areas of the theme. But because Artisteer doesn't add semantic classes you can't isolate a specific page.

You can add semantic classes easily if you are running WP 2.8+ by changing the body tag in the header.php to this...

<body <?php body_class(); ?>>


Now you can isolate the CSS on a specific page for the bullets, such as this for the contact page...


.page-id-97 ol, .page-id-97 ul { 

margin-left: 11em;
}


Note: The .page-id-97 will be unique for your installation so you need to check the id and change the CSS accordingly

There are other ways to add even more semantic classes for even more control but they are a bit more complicated.

I modified my Artisteer files to add the semantic classes to all my themes.

Bud
budstechshed.com