Jump to content
Sign in to follow this  
zone5landscapes

Custom css for post title location?

Recommended Posts

zone5landscapes

Hi, I am new to PP and while it looks perfect for my online photography gallery I am struggling a little formatting single posts. What I want to do is show the post Title below an image included in the body of each post. There is a single page per image and the design style calls for the image first, then the title below and centered and then a brief description. ideally I want each of the above in a different div so that I can style the post using CSS... I am hoping this is possible within the php code so that I can automate as much as possible, failing that I suspect I am going to have to create custom fields for the title and description and then just attach the image to the posts... help / advice most welcome, I need to get this site up and running :-) (Right now the site is local to my Mac running in MAMP, so I cannot share the link yet I am afraid)

Share this post


Link to post
Share on other sites
Kate

Hi Andrew, I would take advantage of WordPress' built-in "Featured Image" option. If you choose to show thumbnails on the single page (in Settings->Blog and Posts) then you should see it appear. Now, you may want to adjust the width of the "thumbs" in "Settings->Media". From there, you basically have two options: if the images are always going to be the same height, you can absolutely position the post title inside of the parent div, moving it down to just below the image. If that's not ideal, then you would have to edit template.postloop.php (after copying it into platformbase), moving the title (or featured image) for "single" pages.

Share this post


Link to post
Share on other sites
zone5landscapes

Thanks Kate, I have been using the featured image and thumbs for other things as well - take a look at the image below which is where I am heading. The thumbs just have a basic image, the main image I need here shows the work framed and needs to be big enough to see as a whole. Looks like I need to fiddle with the template.postloop.php file a little - nice to have the guidance though, at least I know I am on the right track. Many thanks Andrew here's the image in case you are interested <a href=%7Boption%7Dhttp://i.imgur.com/FwhMs.png' alt='FwhMs.png'>

Share this post


Link to post
Share on other sites
cmunns

So you want the single post pages to show the thumbnail in a very large format. You could add thumbs then just add a larger size inside of the post content area manually. Not sure if that works for you? But yes play with the template.postloop.php file to move around items like post title etc.

Share this post


Link to post
Share on other sites
zone5landscapes

Thanks Adam, I am trying to keep things as clean as possible so only one image at the top of the page - the intent is for it as much as possible to look like a framed photograph hanging on a wall... I moved the title around ok but got stuck on separating the image from the description text that follows it - I wanted to extract them from the post in the template and then wrap a class around each bit. So far I am calling the title a second time from php to style it as desired after a post that contains just the large image and then trying to get the `get_post_meta(the_ID(), $key, true);` code to grab the description as a custom field which again I can style by itself. conceptually it works ok I guess - though the get post meta function seems to want to only return the post id for some reason :-). Any other ideas welcome, I'm not sure about using the thumbnail as I want to use a different featured image elsewhere

Share this post


Link to post
Share on other sites
zone5landscapes

update,I think I have this solved now. the custom filed data was a wrong call - I should have used `$array = get_post_custom_values($key);` which returns an array with the desired info in it that I can wrap in a div/class which is ok, putting the text in the content and extracting it might be neater though. For the Title I added a copy of the title below the content and above the custom description field which can then be styled as desired - that leaves a formatting change to the top of the post to make the title less obvious in its original location. The hooks in pp are just great by the way now I am off to figure out some more formatting issues for post content background images... thanks for the advice folks

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×