Community Forums › Forums › Archived Forums › Design Tips and Tricks › Agentpress Featured Posts Alignment
Tagged: Agentpress theme
- This topic has 10 replies, 2 voices, and was last updated 11 years, 4 months ago by John.
-
AuthorPosts
-
December 11, 2012 at 9:20 am #4497hickmancMember
Is it possible, with the Featured Posts widget, to get there to be a 2x2 box of posts rather than them all being displayed in a single column? Or is there a way to accomplish something similar with a similar widget?
Just to clarify, here is what I'm talking about, except for maybe with a little excerpt/blurb to go with it
http://s12.postimage.org/5762hu3l9/example_Of_What_IWant.png
Thanks!
December 12, 2012 at 9:12 am #4700hickmancMemberbump. plz help!
December 12, 2012 at 9:41 am #4714JohnParticipantPosting the URL of your site would help us help you.
John Sundberg | blackhillswebworks.com
A WordPress developer’s toolbox: Firebug | WordPress Codex | Google 😉December 12, 2012 at 9:42 am #4715hickmancMemberhttp://saacurh2012.com/wordpress/
I'm trying to get the Featured Posts in the Featured Bottom Left widget area to go into two columns-- I would like a 2x2 square of featured posts. If I can accomplish this more easily with a different widget, that's fine too. Thanks!
December 12, 2012 at 9:53 am #4727JohnParticipantGive this a shot (by adding it to your style.css)
.featured-bottom .featuredpost .post {
float: left;
padding: 0 10px 10px;
width: 46%;You'll probably want to tweak the padding and width to get it looking just right.
John Sundberg | blackhillswebworks.com
A WordPress developer’s toolbox: Firebug | WordPress Codex | Google 😉December 13, 2012 at 3:07 pm #5037hickmancMemberWow! That worked! Thanks!
Do you know how to get rid of the gray lines between the two rows? I thought that maybe they were horizontal rules so I set those to 0px in the CSS, but that didn't do anything.
Thanks!
December 13, 2012 at 3:22 pm #5046JohnParticipant.featured-bottom .featuredpost .post {
border-bottom: none;
}You're welcome!
John Sundberg | blackhillswebworks.com
A WordPress developer’s toolbox: Firebug | WordPress Codex | Google 😉December 14, 2012 at 6:56 pm #5315hickmancMemberThat worked! Hey, you're good at this.
Just out of curiosity, if I had a second Featured Posts widget, but I wanted them to appear vertically (sort of like the original), how would I go about changing that without ruining my first 2x2 widget?
Thanks!
December 15, 2012 at 12:35 pm #5431JohnParticipantWordPress assigns each widget an unique ID, and you can use that to drill down in your CSS to a particular widget. For example, the current Featured Post widget has an ID of
#featured-post-5
so we could have added that to the previous CSS code like this
.featured-bottom #featured-post-5.featuredpost .post {
border-bottom: none;
}Then you could switch out "5" with the ID of the new widget in some additional CSS and change the CSS accordingly.
John Sundberg | blackhillswebworks.com
A WordPress developer’s toolbox: Firebug | WordPress Codex | Google 😉December 15, 2012 at 12:42 pm #5433hickmancMemberThank you! But how do I figure out the ID of the widget?
December 15, 2012 at 12:50 pm #5434JohnParticipantUse Firefox as your browser, and install Firebug. Chrome has a lite version of Firebug, but it's not quite up to snuff with Firefox in this regard, in my opinion.
Then search Google for "firebug tutorial," or check this one out:Â http://www.w3resource.com/web-development-tools/firebug-tutorials.php
John Sundberg | blackhillswebworks.com
A WordPress developer’s toolbox: Firebug | WordPress Codex | Google 😉 -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.