I try to explain my issue:
I use the last version of Shaken Grid Premium template
I created my first website (www.aleinno.com) that works as portfolio of my recent works
If you click on a featured image on the home, you get redirected to the connected single post (for instance this one, Cloudy, fruit and cocktail)
as you can see there are several images inside the post itself
I installed the “Fancybox for WordPress” plugin, because I wanted a clicked image to be displayed fullscreen inside a fancybox! (and of course with previous/next arrows with the possibility to show one by one all the images in the post)
but, as you can see, it doesn’t work on my site… and I really don’t know why!
when you click on any image inside an article, it’s displayed “alone” in fullsize
can anyone help me, please? I’m almost desperate…
thank you very much for reading this!
]]>Has anyone gotten infinite scroll to work with Shaken Grid? If so, please share your wisdom in layman’s terms.
I’m giving up for now – hoping someone has some firsthand knowledge on this.
]]>I only want to show the latest post from each category on the index page, for all of the categories. And I want to show them in chronological order, so that the category containing the most recent post will appear first on the first page.
Here’s the code that should print out the posts on the index page.
]]>There seems to be some alternative way of spacing without using margin-css.
Has anyone encountered this? Can you give me a push in the right direction?
]]>I am pretty frustrated with this one. I modified the Shakengrid free theme for my homepage and wanted to add infinite scroll to it.
But now, after several days, I still can’t get it to work, and I don’t know what else I could do.
https://www.botbots.de
I don’t use the WP plugin, but call the “jquery.infinitescroll.min.js” in the scripts section of the header along with the function.
The structure of my page should work according to the infos on https://www.infinite-scroll.com
This is my structure:
<div id="sort" class="masoned" style="position: relative; height: 919px;">
<div class="box" style="position: absolute; left: 10px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 300px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 144px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 265px; margin: 10px;">
<div class="box" style="position: absolute; left: 10px; top: 280px; margin: 10px;">
<div class="box" style="position: absolute; left: 300px; top: 280px; margin: 10px;">
<div class="box" style="position: absolute; left: 10px; top: 369px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 399px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 405px; margin: 10px;">
<div class="box" style="position: absolute; left: 10px; top: 458px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 518px; margin: 10px;">
<div class="box" style="position: absolute; left: 300px; top: 535px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 630px; margin: 10px;">
<div class="pagination">
<div class="prev">
<a href="https://www.botbots.de/page/2/"> older entries </a>
</div>
<div class="next"></div>
</div>
</div>And this is the script:
<script type="text/javascript">
function infinite_scroll_callback() {
}
jQuery(document).ready(function($) {
$('#sort').infinitescroll({
debug : false,
loading : {
img : "https://www.botbots.de/wp-content/uploads/2012/01/infinite_loop_loading.png",
},
state : {
currPage : "1"
},
nextSelector : "div.pagination div.prev a",
navSelector : "div.pagination",
contentSelector : "#sort",
itemSelector : "#sort div.box",
pathParse : ["https://www.botbots.de/page/", "/"]
}, function() { jQuery('#sort').isotope( 'appended', jQuery( arguments[0] )); } );
});
</script>Maybe, after several attempts I messed up all the code, but I just don’t see it anymore. Where could the problem be?
Thanks in advance
Christoph
I am pretty frustrated with this one. I modified the Shakengrid free theme for my homepage and wanted to add infinite scroll to it.
But now, after several days, I still can’t get it to work, and I don’t know what else I could do.
www.botbots.de
I don’t use the WP plugin, but call the “jquery.infinitescroll.min.js” in the scripts section of the header along with the function.
The structure of my page should work according to the infos on www.infinite-scroll.com
This is my structure:
<div id="sort" class="masoned" style="position: relative; height: 919px;">
<div class="box" style="position: absolute; left: 10px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 300px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 10px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 144px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 265px; margin: 10px;">
<div class="box" style="position: absolute; left: 10px; top: 280px; margin: 10px;">
<div class="box" style="position: absolute; left: 300px; top: 280px; margin: 10px;">
<div class="box" style="position: absolute; left: 10px; top: 369px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 399px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 405px; margin: 10px;">
<div class="box" style="position: absolute; left: 10px; top: 458px; margin: 10px;">
<div class="box" style="position: absolute; left: 880px; top: 518px; margin: 10px;">
<div class="box" style="position: absolute; left: 300px; top: 535px; margin: 10px;">
<div class="box" style="position: absolute; left: 590px; top: 630px; margin: 10px;">
<div class="pagination">
<div class="prev">
<a href="https://www.botbots.de/page/2/"> older entries </a>
</div>
<div class="next"></div>
</div>
</div>And this is the script:
<script type="text/javascript">
function infinite_scroll_callback() {
}
jQuery(document).ready(function($) {
$('#sort').infinitescroll({
debug : false,
loading : {
img : "https://www.botbots.de/wp-content/uploads/2012/01/infinite_loop_loading.png",
},
state : {
currPage : "1"
},
nextSelector : "div.pagination div.prev a:first",
navSelector : "div.pagination",
contentSelector : "#sort",
itemSelector : "#sort div.box",
pathParse : ["https://www.botbots.de/page/", "/"]
}, function() { window.setTimeout(infinite_scroll_callback(), 1); } );
});
</script>see Shaken Grid as example:
https://demo.shakenandstirredweb.com/shaken-grid/
Shaken Grid has this feature plus it also does slideshows as a featured image.
However, I am having a hard time dissecting how to do it manually.
It does something like: post youtube embed code into post in soy_vid section; go to loop.php, if $vid = get_post_meta($post->ID, ‘soy_vid’, true); echo $vid
I cannot seem to make it work add this onto my own theme.
1. is there a plugin for this?
2. how to add this to my theme correctly?
thanks!! a million
]]>I’m new to WP-devellopment and html – coding, so looking for a help in such a customization of Shaken Grid 2.0 Premium theme.
On the posts page (here) when user hovers over the post image 3 icons became available:
– Enlarge
– Share
– Comment
I need to add one more icon (Add to Basket) , which will add post item (good) to the customer basket
Any help on ideas & code customization is needed (includes/action-buttons.php)
I can pay for it
[Code moderated as per the Forum Rules. Please use the pastebin]
]]>