I have a design that requires and custom design for the teaser view. I need to output the custom teaser view then have the full post follow another template.

The teaser has a float left thumbnail image and a few lines of text to the right. The actual post will have many images and text.

Is this possible?

1 Answer 1


Sure it is possible.For that you need to add custom field in your content type called featured image. While creating the views use that field first and you can have to add

float: left;

In Image field css class to align it left

For exmaple you can see my site www.techiestuffs.com which is exactly what you mentioned.The teaser has image aligned left and when you click either image or title it will leads to original content. see the below css code i used to achieve this

  .view-recentarticles .views-field-field-image {
float: left;
padding: 3px;
border: 1px solid #C9C9C9;
white-space: nowrap;
.view-recentarticles {
border:1px solid #ccc;

.view-recentarticles .views-field-title {
  margin-bottom: 10px;
  font-size: 18px;
  line-height: 1.4;
  .view-recentarticles .views-field-title a {
  transition: all 0.2s;
  -moz-transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
 .view-recentarticles .views-field-title a:hover {
  color: #181818;
 -webkit-transition: all 0.2s;
  text-decoration: none;
  background-color: #f6ecdd;
  .view-recentarticles .views-field-body {
  border-bottom:2px solid #f4f4f4;
    .view-recentarticles .views-field-field-blog-author {
  padding:5px 2px 5px 2px;
  • Great this will help. I am having trouble controlling the output. The theme developer tells me to edit views-view-fields.tpl but that file doesn't look like the others and any edits I make don't work. What do I do? Dec 28, 2011 at 3:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.