forum.coppermine-gallery.net
Support => cpg1.5.x Support => cpg1.5 themes (visuals) => Topic started by: allvip on July 25, 2014, 07:14:26 am
-
I already wrapped in a div every 10 thumbnails (code by Andre posted in thread Wrapp content in a diffrent div after each 10... http://forum.coppermine-gallery.net/index.php/topic,77274.0.html (http://forum.coppermine-gallery.net/index.php/topic,77274.0.html).
for Andre:
Can you please help me insert a custom divs after every 10 thumbnails like this:
<div class="cpg_main_block_inner">
<div class="maintable">
<div class="albThDiv1"><div class="thumbnails">thumb_image_1.jpg</div> <div class="thumbnails">thumb_image_2.jpg</div> <div class="thumbnails">thumb_image_3.jpg</div> <div class="thumbnails">thumb_image_4.jpg</div> <div class="thumbnails">thumb_image_5.jpg</div> <div class="thumbnails">thumb_image_6.jpg</div> <div class="thumbnails">thumb_image_7.jpg</div> <div class="thumbnails">thumb_image_8.jpg</div> <div class="thumbnails">thumb_image_9.jpg</div> <div class="thumbnails">thumb_image_10.jpg</div></div><div id="th1">CUSTOM CONTENT</div>
<div class="albThDiv2"><div class="thumbnails">thumb_image_11.jpg</div> <div class="thumbnails">thumb_image_12.jpg</div> <div class="thumbnails">thumb_image_13.jpg</div> <div class="thumbnails">thumb_image_14.jpg</div> <div class="thumbnails">thumb_image_15.jpg</div> <div class="thumbnails">thumb_image_16.jpg</div> <div class="thumbnails">thumb_image_17.jpg</div> <div class="thumbnails">thumb_image_18.jpg</div> <div class="thumbnails">thumb_image_19.jpg</div> <div class="thumbnails">thumb_image_20.jpg</div></div><div id="th2">OTHER CUSTOM CONTENT</div>
<div class="albThDiv3"><div class="thumbnails">thumb_image_21.jpg</div> <div class="thumbnails">thumb_image_22.jpg</div> <div class="thumbnails">thumb_image_23.jpg</div> <div class="thumbnails">thumb_image_24.jpg</div> <div class="thumbnails">thumb_image_25.jpg</div> <div class="thumbnails">thumb_image_26.jpg</div> <div class="thumbnails">thumb_image_27.jpg</div> <div class="thumbnails">thumb_image_28.jpg</div> <div class="thumbnails">thumb_image_29.jpg</div> <div class="thumbnails">thumb_image_30.jpg</div></div>
</div>
</div>
-
I want it after each 10 but in the example above I adeed after each 1 to make the post shorter.
-
I assume you're currently using this code:
if ((($i % 10) == 0) && ($i < count($thumb_list))) {
echo '</div><div class="albThDiv'.($i / 10 + 1).'">';
}
If so, just insert your custom div between
</div>and
<div class="albThDiv'.($i / 10 + 1).'">
E.g.
$content[1] = 'foo';
$content[2] = 'bar';
if ((($i % 10) == 0) && ($i < count($thumb_list))) {
echo '</div><div id="th'.($i / 10).'">'.$content[$i / 10].'</div><div class="albThDiv'.($i / 10 + 1).'">';
}
-
That inserts it after every thumbnails wrapper (after every albThDiv+1) not after 10 thumbnails wrapper (after albThDiv10,after albThDiv20,after albThDiv30).
Like this:
<div class="cpg_main_block_inner">
<div class="maintable">
<div class="albThDiv1">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv2">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv3">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv4">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv5">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv6">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv7">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv8">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv9">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv10">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div id="th1">CUSTOM CONTENT</div>
<div class="albThDiv11">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv12">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv13">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv14">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv15">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv16">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv17">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv18">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv19">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv20">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div id="th2">CUSTOM CONTENT 2</div>
<div class="albThDiv21">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv22">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv23">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv24">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv25">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv26">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv27">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv28">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv29">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div class="albThDiv30">the div has 10 thumb_image.jpg.Each one wrapped in class thumbnails</div>
<div id="th3">CUSTOM CONTENT3</div>
</div>
</div>
-
I know the title of the topic is after 10 thumbnails but was my mistake to name it this way.
-
Actually I want to use diffrent values for every code.
AlbThDiv to have $i % 5 (wrapp only 5 thumb) and th to have $i % 10 (after AlbThDiv10,after AlbThDiv20...)
-
After more research on google it looks like is not a simple way to do this.Is a little complicated.I think I don't have to use count($thumb_list) because is counting the thumbnails.I have to write code to count divs with class AlbDivTh+1 and other code stuff.
I decided to use Andre's code from reply Reply #2.I just added even classes th and item to custom divs.In the code I will have only $content[10] and $content[20] because I want content only in those divs.
$content[10] = 'foo';
$content[20] = 'bar';
if ((($i % 10) == 0) && ($i < count($thumb_list))) {
echo '</div><div class="item th" id="th'.($i / 10).'">'.$content[$i / 10].'</div><div class="albThDiv'.($i / 10 + 1).'">';
}
then in my_style.css I added:
.th {
width:0px;
}
#th10,#th20 {
width: 32.6%;
}
I added class item because I use masonry and the masonry code from my template.html is for elemets with class item.
I use class .th width:0px because for masonry to work every div must have a width and because I do not want the divs to show.
I want only divs th10 and th20 to show so I added to css #th10,#th20 width:32.6% (32.6% is the with of all my divs AlbThDivs.
Now #th10,#th20 is part of the masonry layout and other th divs do not show beacause they they width 0px.
That's my solution and is perfect for me.
Thanks a lot Andre.
-
AlbThDiv to have $i % 5 (wrapp only 5 thumb) and th to have $i % 10 (after AlbThDiv10,after AlbThDiv20...)
So you want to add your custom div after every 50 thumbnails right? I don't see a reason why this should be complicated, as we just need to add a second counter.
-
So you want to add your custom div after every 50 thumbnails right? I don't see a reason why this should be complicated, as we just need to add a second counter.
I don't want the code to count the thumbnails(the counter from the first code to count the thumbnails) .
I want it to count the wrappers (the albThDivs from the first code).
In the end a second counter is what I need.
Thanks.