Search Form and Social Buttons

HotThemes Logo and Top Menu

To request a forum account, please login here and open support ticket. Only customers with active order(s) can open forum account!

× Discussion about "Photo Portfolio" Joomla template.

Topic-icon Gallery page

More
5 years 11 months ago #5285 by canda13
Hi,I am trying to get 4 thumbnails across the page in my gallery and i am unable to do this in the photogallery plug in. It will not go beyond 2 across:

The url is:

www.greatorexfinearts.com/index.php?opti...cle&id=28&Itemid=120

Also I need to remove the brown coloured border around the thumbnail images.

Any advice on how to do the above would be appreciated.

Many thanks,

Chris

Please Log in to join the conversation.

More
5 years 11 months ago #5312 by ivan.milic
To remove brown border:
In template_css.css find:

#gallery img {
margin: 0px 20px 20px 0px;
padding: 5px;
border: 1px solid #FFD441;
display: block;
float: left;
}

Then you will have gray border. There is one more time:

#gallery img {
margin: 0px 0px 0px 0px;
padding: 3px;
border: 1px solid #CCC;
display: block;
float: left;
}

To remove it go to Template Manager - > Edit HTML or maybe in template_css.php

To display 4 in a row:

In template_css.css you have:

.gallery_container {
width: 400px;
float: left;
}

change 400px to 800px.

Then go to Template Manager - > Edit Html
And add this just before </head>:
<style type="text/css">
#gallery .clear {
clear: none;
}
</style>

Please Log in to join the conversation.

More
5 years 11 months ago #5380 by canda13
Many thanks for your help,

I still have a problem in that the 2nd row of images does not start to the left of the page see url:

www.greatorexfinearts.com/index.php?opti...cle&id=28&Itemid=120

the top row is fine and exactly what I want.

The 2nd row needs to start at the left hand side and not where it is now.

Many thanks in advance.

Chris

Please Log in to join the conversation.

More
5 years 11 months ago #5395 by ivan.milic
Hi,

We must try second solution. Got to Extensions->Template Manager, then click Edit HTML

Put next script block inside <head> tag:

<script type="text/javascript">

jQuery(documen).ready(function(){
var COLUMNS = 5;
var gal = jQuery('#gallery');
if(gal[0]){
gal.find('.clear').remove();
var TABLE = jQuery("<table cellpadding='0' cellspacing='0' ></table>");
var row = jQuery('<row></row>');
var n = 0;

while(gal.children('a').length != 0)
{
n++;
var chld = jQuery(gal.children('a')[0]);
row.append(chld);
if(n == COLUMNS)
{
n = 0;
TABLE.append(row);
row = jQuery('<row></row>');
}
}

if(row.children().length > 0){
TABLE.append(row);
}
gal.html('');
gal.append(TABLE);
}
});

</script>


Maybe it will not work first time but leave it there so I could debug it and send to you final version.

Please Log in to join the conversation.

More
5 years 11 months ago #5396 by ivan.milic
You can change number of columns var COLUMNS = 5; put some other value if you want.

Please Log in to join the conversation.

More
5 years 11 months ago #5423 by canda13
Ok, I have inserted the script but there is no change to the layout.

The script remains in the html for debugging

Many thanks again for all your excellent support thus far

Regards,

Chris

Please Log in to join the conversation.

Time to create page: 0.129 seconds

Links, Partners and Social Media