Community Forums › Forums › Archived Forums › Design Tips and Tricks › Making visual changes to different pages
- This topic has 6 replies, 2 voices, and was last updated 10 years, 9 months ago by badedyr.
-
AuthorPosts
-
August 2, 2013 at 6:40 am #53721badedyrMember
Being new to both coding and Genesis i'm having a hard time figuring out how to make changes that goes beyond just CSS edits.
I am currently using the Quattro theme and i have managed to make some small changes to placement of comments, remove author info etc. using shortcodes.However there are a few things i cannot locate where to change:
- I would like to align the "Comments" to the right side (http://demo.studiopress.com/quattro/) instead of it being next to the author
- Each post is separated by a double-line - can i add a single line where i want to separate sections? eg. if i wanted to add a single line between "About" and "Comments" sections here: http://demo.studiopress.com/quattro/threaded-comments/Of possible i would also like to change how some of the DIV tags behaves. eg. the "Filed Under" and "Tagged With" is currently in a gray box where i would like to just have a single line, then the categories/tags and then a line and then a "You may also like" section etc.
I think i need to use Hooks but i am lacking an example that shows me how i could make these "design changes".Thank you in advance.
http://demo.studiopress.com/quattro/August 2, 2013 at 7:36 am #53723kelmomMember1) To get the comments to be placed to the right, do the following:
span.comments { float:right; }
2) Iit looks like span.comments .tags has a background image that produces the line you see as a separator between author and comments.
span.comments .tags {
background: url("images/nav-line.png") no-repeat left center transparent;
}You could replace nav-line.png with another graphic that has a single line only. 🙂
3) Here is a plugin for related posts: http://wordpress.org/plugins/wordpress-23-related-posts-plugin/
You could change the "Related Posts" heading to "You May Also Like"
Hope this helps! 🙂
~Kellie~
August 2, 2013 at 8:30 am #53738badedyrMemberI just tried adding
span.comments { float:right; }
to style.css but that does not seem to change anything. The nav-line.png and the comments part is still aligned to the left right after the author name.
The double line i was referring to was the line that separates 2 posts on the frontpage. I was interested in using such a line to add additional content after the post-content. eg. after the post i would have a section with "tags, categories" which visually would be separated from the post content with a horizontal line.
thanks!
August 2, 2013 at 9:57 am #53754kelmomMemberDid you clear your cache? Or do you have a caching plugin active while making changes? If you do, then it will be hard for you to see the changes you have made on your site because the site will reflect the cached page.
If you want, post your URL and I can help troubleshoot. 🙂
Here is the code that is making the double line separator between posts:
.post {
border-bottom: medium double #CCCCCC;
margin: 0 0 30px;
padding: 0 0 40px;
}Change border-bottom to : medium single #cccccc;
This will give you a single line in between the posts. 🙂
~Kellie~
August 2, 2013 at 10:15 am #53763badedyrMemberDont know if i have a caching plugin active 🙂 I can see other changes like font size etc. but the float:right did not do anything.
When i change the border-bottom to single it just disappears as in i dont see any lines not even a single.
The blog is currently not publicly available as its only running internal at the moment.Also is it possible to make individual changes to separate pages?
I would like one look with comments on the front page showing all posts but another layout on the individual pages. eg. i dont want it re-using the 'genesis_post_info', 'post_info_filter' on the main page as well as on the individual pages.
August 2, 2013 at 10:21 am #53767kelmomMemberTry :
span.comments .tags {
float: right;
}Does that do anything?
Individual pages or individual posts? Do you mean that if someone clicks on a post on the front page, then you don't want 'genesis_post_info' or 'post_info_filter' to show?
~Kellie~
August 2, 2013 at 12:10 pm #53780badedyrMemberSorry, yes, I meant individual posts. I would like to achieve something along the lines of this:
http://www.garancedore.fr/en/2013/08/01/clean/
Here the categories and tags are nicely separated from the social icons but still part of the post visually and the "you may also like" section and "comments" is in its own.
Wen looking at the front page that post named "clean" only shows date, categories and comments differently from when you click the post.Thanks - I'm hoping I can figure out how to make such design changes 🙂 not really sure if I need hooks for this controllable as widgets or what I need to go after.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.