5.00 (1 votes)

Would you like to insert and display separate images for intro text and full article in your blog? Start using standardized images to save your time!

What should be configured?

Navigate Content -> Article Manager and click on the Options button (at top right). Then open Editing Layout tab to check if:

  • Administrator Images and Links paremater is set to Yes
  • if you need to enable this option for front end editing set Yes to Frontend Images and Links
     

intro images in Joomla


You can also specify placement for images, take a look at Intro Image Float and Full Text Image Float settings.

Important CSS styles

The intro image will use the following classes: img-intro-none, img-intro-right, img-intro-left, so make sure that your template includes the relevant css style, otherwise siply add the following styles to your template.

.img-intro-none{
   text-align: center;
   margin-bottom: 10px;
}
.img-intro-left{
   float: left;
   margin-right: 10px;
}
.img-intro-right{
   float: right;
   margin-left: 10px;
}

The similar code should be placed for Full Text Image Float if needed.

.img-fulltext-none{
   text-align: center;
   margin-bottom: 10px;
}
.img-fulltext-left{
   float: left;
   margin-right: 10px;
}
.img-fulltext-right{
   float: right;
   margin-left: 10px;
}

In addition you can add for example any border, shaddow or background for the image container.

Inserting the image

Once the necessary configuration is done save settings and edit any article to check how it works.

Open Images & Links tab, should see as follows:

 

images links tab

Select the image, do not forget about Alt text - it's important to your site's search engine optimization since an effective image alt tag helps robots to understand the image you inserted on yur site.

The Result

intro-images-result

Users' reviews

Total rating: 5.00 (1 votes) Add review
5.00

Great! Saved me time. Thank you.

Video Tutorials

EF4 Framework for Joomla! 3 - introduction

Joomla! 3 Quickstart Installation Guide

Speed up your website! Must watch video!

How to create Joomla article?

Joomla ReCaptcha - how to set up?

How to use Joomla editors?

How to display a module in Joomla article?

How to configure Joomla contact form?

How to check Joomla module positions names?

How to configure your language for Joomla 3?

How to create Joomla custom HTML module?

How to create Joomla menu?

INDICO S.C.

ul. Wałowa 10/3, 84-200 Wejherowo, registered in Centralna Ewidencja i Informacja o Działalnosci Gospodarczej
NIP/VATID: PL5882424318

Copyright © 2009-2017 Joomla-Monster.com All rights reserved. Joomla! is Free Software released under the GNU/GPL License.
The Joomla!® name is used under a limited license from Open Source Matters in the United States and other countries. Joomla-Monster.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.