Thumbnail Images

[Dead Eddie]

Originally Posted by Jokorey

How do I associate a preview image with an article?

The preview image is associated when you save an article. Typically, it's either the first one attached or embedded in the article (it's also what displays on the section/category pages).

Originally Posted by Jokorey

Also, where should I insert this code?

Simple answer is "Insert it where you want it to show up".

I've attached an idea of where I'd start (although, I haven't previewed this, so the display may be wonky...try it on a test board!). I've bolded my edits, in case you're looking for them.

<div class="cms_widget">
<div class="block">
	<div class="cms_widget_header">
		<h3> <a href="LINK">{vb:raw widget_title}</a></h3>
	</div>
	<div class="cms_widget_content widget_content">
		<vb:each from="articles" key="contentid" value="article">
			<div class="cms_widget_post_bit widget_post_bit">
				<div class="cms_widget_post_userinfo widget_post_userinfo">
					<div class="cms_widget_post_useravatar widget_post_useravatar"> 
						<vb:if condition="$article['showuser'] OR $article['settingsforboth'] == 2">
							<vb:if condition="$article['avatar']">
								<a class="comments_member_avatar_link" href="{vb:link member, {vb:raw article}}"><img alt="{vb:raw article.username}" src="{vb:raw vboptions.bburl}/{vb:raw article.avatar.0}" {vb:raw article.avatar.1} /></a>
							<vb:else />
								<img alt="{vb:raw article.username}" src="{vb:stylevar imgdir_misc}/unknown.gif" />
							</vb:if>
						<vb:else />
							<img alt="" src="{vb:stylevar imgdir_misc}/unknown.gif" />
						</vb:if>
					</div>
				</div>
				<div class="cms_widget_post_comment widget_post_comment">
					<vb:if condition="$article['showtitle'] OR $article['settingsforboth'] == 2">
						<h4 class="cms_widget_post_header widget_post_header"><a href="{vb:raw article.page_url}">{vb:raw article.title}</a></h4>
					</vb:if>
					<div class="cms_widget_post_content widget_post_content"><vb:if condition="$article['previewimage']"><img src="{vb:raw article.previewimage}" width="{vb:math {vb:raw article.imagewidth} / 2}" height="{vb:math {vb:raw article.imageheight} / 2}" /></vb:if>
{vb:raw article.previewtext}... <a href="{vb:raw article.page_url}">{vb:rawphrase read_more}</a></div>
					<vb:if condition="$article['showuser'] OR $article['settingsforboth'] == 2">
						<a href="{vb:link member, {vb:raw article}}" class="username">{vb:raw article.username}</a>
					</vb:if>
					<a href="{vb:raw article.page_url}" class="lastpostdate understate" title="{vb:rawphrase go_to_last_post}"><vb:if condition="$article['showpublishdate'] OR $article['settingsforboth'] == 2">{vb:date {vb:raw article.publishdate}, {vb:raw vboptions.dateformat}}<vb:if condition="!$show['detailedtime']">, <span class="time">{vb:date {vb:raw article.publishdate} {vb:raw vboptions.timeformat}}</span></vb:if></vb:if></a>
					   <vb:comment>
							<div class="searchcat">
								<h4 class="searchlastpostlabel understate">{vb:rawphrase content} :</h4>
								<span class="understate">{vb:rawphrase article}</span>
							</div>
					   </vb:comment>

						<vb:if condition="$article['categories']">
							<div class="searchstats">
								<h4 class="searchlastpostlabel">{vb:rawphrase categories}: </h4>
								<vb:each from="article['categories']" key="categoryid" value="category">
									<a href="{vb:raw category.category_url}">{vb:raw category.category}</a>&nbsp;
								</vb:each>
							</div>
						</vb:if>

						<vb:if condition="$article['tags']">
							<div class="searchstats">
								{vb:rawphrase tags}: 
								<vb:each from="article['tags']" key="tagid" value="tagtext">
									<a href="{vb:raw vboptions.bburl}/tags.php?tagid={vb:raw tagid}">{vb:raw tagtext}</a>&nbsp;
								</vb:each>
							</div>
						</vb:if>
				</div>

			</div>
		</vb:each>
	</div>
</div>
</div>