Posts: 2,094
Threads: 54
Joined: Jan 2011
(2013-11-20, 10:29:29)stryker Wrote: I am using bootstrap 3 and just want to CENTER the whole gallery (Prettyphoto) inside the parent container / div / column. I've tried for ages to change the relevant CSS styles but stubbornly the gallery always seem to float / align left.
You just have to make your own rules more specific than the generated rules, for CSS rule precedence see e.g. http://www.vanseodesign.com/css/css-spec...-cascaade/.
It helps if you have multiple IDs in your template e.g. <body id="body"> <div id="content"> and then specify the rule as #body div#content ... { ... }. You can look at the developer tools of your browser to see in which order the CSS rules are applied.
Posts: 89
Threads: 12
Joined: Feb 2012
Thankyou mvlcek. I already have the developer tools when trying to figure it out. I will go back to to the drawing board and see if I can figure it out
Posts: 89
Threads: 12
Joined: Feb 2012
Hi, I've spent another few hours trying to figure it out adding divs and CSS everywhere on all levels etc. If anybody has already figured out how to center a gallery in a parent container or div then I'd much appreciate it.
For example if the gallery only has 1 pic then it's centered or if the gallery has three pics across then those are centered as well.
Thanks in advance
Posts: 22
Threads: 5
Joined: Jan 2012
2013-11-22, 03:26:10
(This post was last modified: 2013-11-22, 03:33:20 by Martin.)
(2013-11-21, 12:31:21)stryker Wrote: Hi, I've spent another few hours trying to figure it out adding divs and CSS everywhere on all levels etc. If anybody has already figured out how to center a gallery in a parent container or div then I'd much appreciate it.
For example if the gallery only has 1 pic then it's centered or if the gallery has three pics across then those are centered as well.
Thanks in advance
Code: div#container_for_gallery .gallery-prettyphoto {
width: width_of_your_thumbs px;
margin: 0 auto;
}
div#container_for_gallery .gallery-prettyphoto .gallery-thumb {
clear: left;
margin: 0;
padding: 0;
}
Posts: 89
Threads: 12
Joined: Feb 2012
Thankyou for you suggestion Martin. This code only seems to work if I want to have one thumbnail displayed per row. The problem I have is to be able to center the whole row of thumbnails (could be 2,3 or 4 per row) within a 100% container div.
I have attached a diagram that may explain it better.
Posts: 2,094
Threads: 54
Joined: Jan 2011
2013-11-22, 06:50:22
(This post was last modified: 2013-11-22, 06:51:19 by mvlcek.)
(2013-11-22, 05:44:25)stryker Wrote: Thankyou for you suggestion Martin. This code only seems to work if I want to have one thumbnail displayed per row. The problem I have is to be able to center the whole row of thumbnails (could be 2,3 or 4 per row) within a 100% container div.
The only way to center multiple objects is by treating them as inline text, e.g. (assuming a div with id "content" surrounds your page content):
Code: #content div.gallery {
text-align: center;
}
#content div.gallery div.gallery-thumb {
display: inline;
float: none;
padding: 0;
border: 0 none;
}
#content div.gallery div.gallery-thumb a img {
padding: 3px;
border: #C7C7C7 1px solid;
}
Posts: 89
Threads: 12
Joined: Feb 2012
Unfortunately I still don't get the thumbnails centered on the page. I have created an "Out of the box" install and only added the gallery plugins that are needed.
My code on the "gallery" page is;
<div id="content">(% gallery name=test %)</div>
I copied your CSS exactly but I only get one icon per row as per this image attached.
I then just take out the "float: none" and multiple thumbnails appear on the same row as expected but again they are not centered in the containing div. (as per this image)
It's getting quite challenging I think. The reason why I thinks it's important is that the gallery looks so much better when centered in the space around it. Especially when the layout is fluid because of the different possible viewpoints.
If I had a magic wand I would also wish for the thumbnails to justified between the parent div no matter what size the view port is - ie the space between the images are the same as the space between the left / right of the parent div and the first / last image on that row - Then again if I had a magic wand I would probable wish for other things as well
Posts: 22
Threads: 5
Joined: Jan 2012
(2013-11-22, 08:01:47)stryker Wrote: Unfortunately I still don't get the thumbnails centered on the page. I have created an "Out of the box" install and only added the gallery plugins that are needed.
My code on the "gallery" page is;
<div id="content">(% gallery name=test %)</div>
I copied your CSS exactly but I only get one icon per row as per this image attached.
I then just take out the "float: none" and multiple thumbnails appear on the same row as expected but again they are not centered in the containing div. (as per this image)
It's getting quite challenging I think. The reason why I thinks it's important is that the gallery looks so much better when centered in the space around it. Especially when the layout is fluid because of the different possible viewpoints.
If I had a magic wand I would also wish for the thumbnails to justified between the parent div no matter what size the view port is - ie the space between the images are the same as the space between the left / right of the parent div and the first / last image on that row - Then again if I had a magic wand I would probable wish for other things as well
I tried mvlcek recommendation – for me it works:
Code: div#your_container_for_gallery .gallery-prettyphoto {
text-align: center;
}
div#your_container_for_gallery .gallery-prettyphoto .gallery-thumb {
float: none;
display: inline-block;
}
Posts: 89
Threads: 12
Joined: Feb 2012
FANTASTIC Martin. That slight variation for some reason did the trick. That's such a relief, it's been bothering me for months
mvlcek, a suggestion to maybe have the thumbnails even across the page independent of the browser width could be a feature in a next version??. The web is going responsive and this would add style to an already great plugin.
Thanks for all your efforts.
Posts: 21
Threads: 6
Joined: Jul 2013
Hello Guys,
installed the Plugin and set the Code (% gallery name=creaton %) into my page.
I think the Plugin dont load pretty photo but i dont know why...
My page is:
http://pegels.be-virtual.org/index.php?id=baustoffe
Thank your very much
Posts: 89
Threads: 12
Joined: Sep 2010
2013-11-25, 03:09:36
(This post was last modified: 2013-11-25, 03:25:35 by alex_d.)
MVlcek,
something strange happens, a cycle gallery suddenly is taking images from thumbs folder instead of from the original one.
From page source:
<div class="gallery-image">
<img src="http://www......com/data/thumbs/i18npic.899x520.website-stads-01.jpg">
while image should come from < ... /data/uploads/website-stads-01.png>
from plugin_cycle.php I suspect that is coming from here:
<?php if ($tp == 'bottom') { ?><div class="gallery-image"><img src="<?php i18n_gallery_image_link($gallery,$item); ?>" alt="name"/></div><?php } ?>
Gallery image cache is empty.
PNG images are uploaded as PNG and as PNG placed in the gallery ..
Gallery Version 1.7.1.
CHeers
Posts: 2,094
Threads: 54
Joined: Jan 2011
(2013-11-25, 03:09:36)alex_d Wrote: something strange happens, a cycle gallery suddenly is taking images from thumbs folder instead of from the original one.
From page source:
<div class="gallery-image">
<img src="http://www......com/data/thumbs/i18npic.899x520.website-stads-01.jpg">
while image should come from < ... /data/uploads/website-stads-01.png>
This is the normal behaviour: If you specify a size for the images, the images will be resized and cached in the thumbs directory.
Posts: 89
Threads: 12
Joined: Sep 2010
ok thanx for your reply,
on the some other gallery's within same GS installation this is not happening and I can use PNG's
Just to mention, I'm not using 'thumbnails' resided by Gallery only uploaded files.
(2013-11-25, 03:34:48)mvlcek Wrote: (2013-11-25, 03:09:36)alex_d Wrote: something strange happens, a cycle gallery suddenly is taking images from thumbs folder instead of from the original one.
From page source:
<div class="gallery-image">
<img src="http://www......com/data/thumbs/i18npic.899x520.website-stads-01.jpg">
while image should come from < ... /data/uploads/website-stads-01.png>
This is the normal behaviour: If you specify a size for the images, the images will be resized and cached in the thumbs directory.
Posts: 2,094
Threads: 54
Joined: Jan 2011
(2013-11-25, 03:58:39)alex_d Wrote: ok thanx for your reply,
on the some other gallery's within same GS installation this is not happening and I can use PNG's
If your image size is equal or larger than the uploaded images than no resizing is needed and the original images are used. So the best way is to upload the images in the size that will be displayed in.
Posts: 89
Threads: 12
Joined: Sep 2010
HI Mvlcek,
it's not about the image size because I'm not resizing them.
After thorow research I suspect that new optimized PNG from tinypng.org started the problem.
When I added new PNG's to the existing gallery somehow they were not coming from /upload/ but from gallery cache.
So I suspect now that problem could be inside 'pic.php' and Mime setup.
Or could it lay on the new version of PHP?
Thanx for your responses,
Alex
(2013-11-25, 07:36:24)mvlcek Wrote: (2013-11-25, 03:58:39)alex_d Wrote: ok thanx for your reply,
on the some other gallery's within same GS installation this is not happening and I can use PNG's
If your image size is equal or larger than the uploaded images than no resizing is needed and the original images are used. So the best way is to upload the images in the size that will be displayed in.
Posts: 2,094
Threads: 54
Joined: Jan 2011
(2013-11-25, 19:25:21)alex_d Wrote: it's not about the image size because I'm not resizing them.
You MUST HAVE SET the maximum image dimensions in your gallery options (to 899 x 520, as seen by the image link), thus causing resizing, otherwise the original image would be displayed.
Posts: 89
Threads: 12
Joined: Sep 2010
Ok thanx for this MVlcek, I'll try it with max size
Cheers
(2013-11-25, 20:39:49)mvlcek Wrote: (2013-11-25, 19:25:21)alex_d Wrote: it's not about the image size because I'm not resizing them.
You MUST HAVE SET the maximum image dimensions in your gallery options (to 899 x 520, as seen by the image link), thus causing resizing, otherwise the original image would be displayed.
Posts: 87
Threads: 1
Joined: Nov 2012
2013-12-01, 06:01:42
(This post was last modified: 2014-01-14, 02:17:44 by bensayers.)
Hi Mvlcek, I'm having an issue after changing my permalink structure from %parent%/%slug%/ to %parents%/%slug%/ - now when I look at the source code for my gallery, the parent slug has been replaced with %parents%
Is there a fix for this? I've updated i18n, i18n Search and i18n Custom Fields.
UPDATE: Version 2.1 of the plugin has resolved this issue. Thanks mvlcek!!
Code: <div class="gallery-thumb" >
<a href="http://domain.com/%parents%/gallery/?pic=galleryname:-3" rel="fancybox-galleryname" title="">
<img src="http://domain.com/data/thumbs/gallery/i18npic.C82x82.imagename.jpg" alt=""/>
</a>
</div>
Posts: 89
Threads: 12
Joined: Sep 2010
Yes this works,
thanx MVlcek!
(2013-11-25, 22:24:08)alex_d Wrote: Ok thanx for this MVlcek, I'll try it with max size
Cheers
(2013-11-25, 20:39:49)mvlcek Wrote: (2013-11-25, 19:25:21)alex_d Wrote: it's not about the image size because I'm not resizing them.
You MUST HAVE SET the maximum image dimensions in your gallery options (to 899 x 520, as seen by the image link), thus causing resizing, otherwise the original image would be displayed.
Posts: 1
Threads: 0
Joined: Dec 2013
Hi
I have a problem, when i use:
Code: (% gallerylink name=gallery1 url=gallery1 thumb=random %)
It shows nothong - blank page.
Code: (% gallery name=gallery1 %)
This works fine.
Where there may be a problem?
Posts: 2
Threads: 0
Joined: Dec 2013
Hi guys,
Please tell me, is there any simple option to make slider (cycle mode) responsive for the screen resolution change ?
Somebody few posts earlier talked about some css rules ? Please give me the actual instructions !
Best regards
zulusnet
Posts: 89
Threads: 12
Joined: Feb 2012
Hello,
I would like to completely disable PrettyPhoto when only displayed on a Phone (iphone / android).
I've played around with the plugin_prettyphoto.php file where the JS gets loaded but can't figure out the exact syntax.
Basically if a device is iphone / android then don't load the jquery.prettyPhoto.js.
Any Ideas or other ways to acheive this. PrettyPhoto does not work too well on phones
Posts: 210
Threads: 15
Joined: Feb 2013
i'm used a:
(% gallery name=start %)
galery name is exist and working in all pages .. but when i'm used a:
<?php get_i18n_content('start-galeria');?>
where a 'start-galeria' is a page name..
and in page 'start-galeria' i'm input this line
(% gallery name=start %)
layout don't see this plugin ;(
print screen:
https://dl.dropboxusercontent.com/u/49983884/in/44.jpg
can enyone help why in
<?php get_i18n_content('start-galeria');?>
or
<?php getPageContent('start-galeria'); ?>
gallery plugin is don't working ??
Posts: 2,094
Threads: 54
Joined: Jan 2011
(2013-12-20, 07:13:41)zulusnet Wrote: Please tell me, is there any simple option to make slider (cycle mode) responsive for the screen resolution change ?
No, there isn't a simple solution. You could probably overwrite the CSS generated by the plugin in your own style sheet based on media queries regarding the screen size.
Posts: 12
Threads: 0
Joined: Jan 2014
2014-01-04, 23:11:39
(This post was last modified: 2014-01-05, 02:04:45 by n4shru11.)
Hello mvlcek.
I have problem with showing gallery. The picture is show but not in slide. Can u guide me how to use your 'I18N Gallery' at GSPixa theme.
I am really sorry i'm newbe at web programing, so please guide me.
Thanks...
--
Never mind, i am done with hard work, hehe...
|