Rokbox2 individual thumbnail sizes and margins
-
-
- Kingsley
- Sr. Rocketeer
- Posts: 179
- Thanks: 0
-
I have a question regarding individual thumbnail sizes for rokbox... which I have primarily resolved with the solution in this thread:
http://www.rockettheme.com/forum/free-joomla-stuff/248793-rokbox2-individual-thumbnail-size?start=0#1240757
However the thumbnail is cropped square, doesn't flush left as intended, and has a large margin around it. I cannot seem to locate where this margin is being assigned using Page Inspector, I've looked in all the tons of enclosing divs... Trying to find the cleanest way to restore the thumbnail to the 'default' position while also using this code to make individual thumbnails a certain specified size different from the one set as the default.
This is the solution by DanG referenced in the thread above:
To your RokBox snippet add - class="size-rokthumb50" where 50 denotes the % of scaling value of the iamge.
<a class="size-rokthumb50" data-rokbox="" data-rokbox-caption="Autogenerated Thumbnail" data-rokbox-generate-thumbnail="" href="/live/joomla-extensions/images/rokbox2/planes_2.jpg"><img class="rokbox-thumb" src="/live/joomla-extensions/images/rokbox2/planes_2_thumb.jpg" /></a>
In your
rt_templateName-custom.css <-{Click CSS Guide below}
file add this:
.size-rokthumb50 > img { transform: scale(.5,.5); } - Last Edit: 5 years 11 months ago by Kingsley. Reason: clarification
-
-
-
- Damir
- Preeminent Rocketeer
- Posts: 22450
- Thanks: 2679
- Web Developer
-
Remove this from your custom css file
.size-rokthumb50 > img { transform: scale(.5,.5); }
and add this:.size-rokthumb50 > img { max-width: 150px !important; display: block; margin-bottom: 15px; } - Available for CUSTOM WORK with Joomla, WordPress and Grav Templates and Gantry Framework!
-
-
-
- Kingsley
- Sr. Rocketeer
- Posts: 179
- Thanks: 0
-
Thanks, sorry for the late reply.
That does almost exactly what I need but the thumbnail is still cropped square. Is there a way to assure the autogenerated thumbnail is to the same width:height (aspect ratio) as the original image or is that asking too much?
Much appreciated.
-
-
-
- Damir
- Preeminent Rocketeer
- Posts: 22450
- Thanks: 2679
- Web Developer
- You have thumb squared, change the thumb and it will be the same aspect ratio.
- Available for CUSTOM WORK with Joomla, WordPress and Grav Templates and Gantry Framework!
-
Time to create page: 0.063 seconds