Article Preview Question

[ashley76]

How can I get my article previews to look like this guys?

http://www.maxconsole.net/

They are pretty slick and I would love to have it look similar on my site...

[ashley76]

Now I basically interested in how they achieved the section header portion of the article preview if anyone can help with that?

The part that has a different colored logo for each section on the left with the posted by and date information on the right...

[GamerPerfection]

No-one know how this is done?

[ashley76]

Just bumping to see if anyone could help out...

[Lynne]

I think you need to get the parentnode for the article (which would be the sectionid - and it's in the cms_node table) and then do a condition based on that which would change the header.

This is the programming help section, so it would help if you could post what you have done already and what error you are getting.

[ashley76]

I guess, I should be in a different section then. I know very little (enough to screw something up) and was wondering if someone had a plan laid out to do this...

thanks for the first bit of information though

[brad_irc]

hey guys, i am the creator of the maxconsole skin. decided to search my url on here, and this thread is not too old.

both your questions are about 'vbcms_content_article_preview' template

first is how I have the article preview thumbnails. i used the thumbnail setting in vbulletin options, and set it to 150px. if you change this option now, you must rebuild your attachments. here is my code snippet and how it works:

	  <vb:if condition="$previewimage">
	    <div>
	   	<a href="{vb:raw page_url}"><img class="cms_article_preview_image" src="{vb:raw previewimage}&thumb=1" alt="{vb:rawphrase article_preview}" /></a>
	    </div>
	  </vb:if>

you can see how i used &thumb=1 to request the thumbnail. i only discovered that little hack about a month ago, saving lots of bandwidth. previously was just using css to set the image width smaller (eww)

css edit to .cms_article_preview_image

max-height: 150px;
max-width: 150px !important;

custom image titles for article category -- you can see how i used vb code to find the parent id; you just have to create each image and name them with the numeric id of each category. the layout of the user name and date are just template editing. firebug is a great tool

<img src="maxcon_assets/box_hdr_{vb:var parentid}.gif" width="90" height="26" class="article_hdr_icon" />

[Lynne]

Thank you, Brad. That is a great skin!

[brad_irc]

Thanks for your kind words Lynne, it means a lot. I noticed you've mentioned my skin a few times when people ask for examples

[ashley76]

AWESOME! Thanks Brad!