Joomla Templates Club 406,261 posts

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#188655

Hi — When I setup the Travel Photos module using the code in the tutorial, it doesn’t create the nice borders or add the marging/padding around each image which the demo has. In fact, in the thumbnail image code, it specifically says “border=”0” “.
How do I get the borders as well as the margin or padding around each thumbnail?

Thanks,
railer

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#497755

So that I can try to best assist you, please provide the url of the site you’re working on,
as well as st “Optimize CSS’ to “No” within your Template Manager–Genral settings

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#497832

Hi Tom,

Thanks for your reply. I have since added borders manually to each image with a img border style attribute. I also added a margin style, but that does not appear to be working.

Do you know if the highslide css or some other css included with the _travel suffix should include the border and marging styles by default, or not? That is what I was assuming would happen, hence my question.

I just sent you the URL via PM and have set the template “Optimze CSS” to “No”.

Thanks,
Railer

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#497939

You need to add css style into Travel photos custom html module, see script

<span class="highslide-img">{japopup type="image" title="Sample Images" content="images/stories/highslide/slide1.jpg" width="594" height="386"} <img src="images/stories/highslide/thumb-1.jpg" border="0" alt="Sample Image" /> {/japopup} </span>

and you can find css style included in template.css file

Open templates/ja_travel/css/template.css file


span.highslide-img a {
background-color: #F6F2ED;
float: left;
margin: 5px;
padding: 4px;
}


2 users say Thank You to Ninja Lead for this useful post

1. railer
2. TomC

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#498318

Thanks Ninja! At first I enclosed all six of my images with a single span tag, but that didn’t work. I had to enclose each {japopup}{/japopup} image within its own set of span tags.

Cheers!

[Author]

Posts