I forgot to mention in the video that you may need to adjust the width for the classes .dg-blog-carousel .et_pb_ajax_pagination_container where I have set it at 3680px. You'll see this in the CSS code. This width worked for 10 posts at a width of 350px. You will need to play around with the width if you have fewer or more posts. If you have any questions or if something was not clear in the video, please leave a comment below. Also, let me know if you want me to make any other general WordPress tutorials. Check out my other Divi tutorials here ==> th-cam.com/play/PLNsnyJYWmvui4Te84ZvmeJfOFbblcCL1c.html
Hello there. Superb instructions and easy to understand. I just have one issue. I am getting two blogs on two sides and there is an empty space between them. Can you help me solve this problem.
Hi @VishalKamble0196 Thank you for your comment. Please refer to the comment thread between benjamingoodwin150 and myself where I provide a solution. If the solution does not work, please provide a link to the website or you can email the link to divigeek@gmail.com. All the best, Ryan
Hello! I just used your Code and it works perfectly well! I have a quick question :) i was wondering if it would be possible to make the slider draggable? I was looking into some javascript but i cant quite understand what i would be needing to add :D
Hi Marie, Thank you for your comment. Yes it should be possible to make the slider draggable, and will look at the code as soon as I can so I can assist you. I'm just busy with urgent projects at the moment, but will try my best to get the code to you as soon as possible. Regards, Ryan
Hi Ryan, First of all, thanks a lot for this super helpful video! Everything has worked well for me so far, except that noew I want to filter out the posts by category. When I select this option, there is an empty space where the articles from other categories would have been. Do you have any code that might fix this? Thanks a lot! Ben
Hi Benjamin, Thank you for your kind words. The reason this is happening is most likely because there are fewer blog posts when you select just one category. The following code sets the width of the container to 3680px: .dg-blog-carousel .et_pb_ajax_pagination_container { display: flex; justify-content: space-between; gap: 20px; width: 3680px; } Because the width of the container is set at 3680px and the container is set to flex with justify-content to space-between, it will create gaps between your blog posts. I think the best option would be to set a post count in the blog module (for instance 6 or however many blog posts you want to show) and then use the calc property to set the width. Here is an example if you set the post count to 6: width: calc(350px * 6); The last digit of 6 would be the post count you set in the blog module. Hopefully this should then fix the issue. If not, please can you post a link so I can investigate further, or you can send the link to divigeek@gmail.com. Thank you, Ryan
Hi @seancallanan8170, Thanks for your comment. If you're using the blog module to display the custom post type, then it should work. If you're using the standard sections, row, columns and modules to display the custom post type, have a look at this playlist that uses a JS library called SwiperJS => th-cam.com/play/PLNsnyJYWmvugVM5tpdfKLtFcPROCv6NqL.html All the best, Ryan
Thank you for the script! I'm not a techie, but with your help, I managed almost all of it. The only issue I'm facing now is that instead of 3 posts in the middle row, I just see one on the left side (it looks like there is empty space for the other two posts next to it). Do you maybe have any idea for me, what I did wrong? Thank you.
Hi Sylvia, Thank you for your comment. Can you share a link so I can have a look why you are having this issue. If you would prefer to share the link privately, please send it to divigeek@gmail.com. Regards, Ryan
Hi @baltazarmilanov, I'll have to have a look at the code again. Please can you send me a link to your web page. Please note that I will only be able to look at this in the next couple of weeks due to tight deadlines. Maybe check out my SwiperJS playlist, as this is more versatile. th-cam.com/play/PLNsnyJYWmvugVM5tpdfKLtFcPROCv6NqL.html Thanks, Ryan
I forgot to mention in the video that you may need to adjust the width for the classes .dg-blog-carousel .et_pb_ajax_pagination_container where I have set it at 3680px. You'll see this in the CSS code. This width worked for 10 posts at a width of 350px. You will need to play around with the width if you have fewer or more posts.
If you have any questions or if something was not clear in the video, please leave a comment below. Also, let me know if you want me to make any other general WordPress tutorials.
Check out my other Divi tutorials here ==> th-cam.com/play/PLNsnyJYWmvui4Te84ZvmeJfOFbblcCL1c.html
Hello there. Superb instructions and easy to understand. I just have one issue. I am getting two blogs on two sides and there is an empty space between them. Can you help me solve this problem.
Hi @VishalKamble0196
Thank you for your comment.
Please refer to the comment thread between benjamingoodwin150 and myself where I provide a solution.
If the solution does not work, please provide a link to the website or you can email the link to divigeek@gmail.com.
All the best,
Ryan
Thank you so much, very helpful!
Hi @transformerscommunity5420,
Thank you for your kind words. I appreciate it.
Glad the tutorial came in handy for you.
All the best,
Ryan
Thank you so much for this tutorial!
Hi @GraceEriksson,
Only a pleasure. Thank you for you kinds word.
All the best,
Ryan
THANK YOU SO MUCH!!!
Hi @kristina_globally,
Thank you for your comment.
All the best,
Ryan
Hello! I just used your Code and it works perfectly well! I have a quick question :)
i was wondering if it would be possible to make the slider draggable? I was looking into some javascript but i cant quite understand what i would be needing to add :D
Hi Marie,
Thank you for your comment.
Yes it should be possible to make the slider draggable, and will look at the code as soon as I can so I can assist you. I'm just busy with urgent projects at the moment, but will try my best to get the code to you as soon as possible.
Regards,
Ryan
@@divigeek Hello Ryan, thanks for the fast answer. Thats so nice of you! Looking forward hearing from you 😁
Hi Ryan,
First of all, thanks a lot for this super helpful video!
Everything has worked well for me so far, except that noew I want to filter out the posts by category. When I select this option, there is an empty space where the articles from other categories would have been.
Do you have any code that might fix this?
Thanks a lot!
Ben
Hi Benjamin,
Thank you for your kind words.
The reason this is happening is most likely because there are fewer blog posts when you select just one category.
The following code sets the width of the container to 3680px:
.dg-blog-carousel .et_pb_ajax_pagination_container {
display: flex;
justify-content: space-between;
gap: 20px;
width: 3680px;
}
Because the width of the container is set at 3680px and the container is set to flex with justify-content to space-between, it will create gaps between your blog posts.
I think the best option would be to set a post count in the blog module (for instance 6 or however many blog posts you want to show) and then use the calc property to set the width. Here is an example if you set the post count to 6:
width: calc(350px * 6);
The last digit of 6 would be the post count you set in the blog module. Hopefully this should then fix the issue.
If not, please can you post a link so I can investigate further, or you can send the link to divigeek@gmail.com.
Thank you,
Ryan
@@divigeek Hi Ryan,
Thanks a lot for this! That solved it :)
Hi Benjamin,
Glad to hear it worked.
All the best,
Ryan
Very good thanks.
Hi Juan,
Thanks so much. Appreciate all your comments.
Regards,
Ryan
Will this work with a custom post type? It seems the js might be specific to the standard blog post type.
Hi @seancallanan8170,
Thanks for your comment.
If you're using the blog module to display the custom post type, then it should work.
If you're using the standard sections, row, columns and modules to display the custom post type, have a look at this playlist that uses a JS library called SwiperJS => th-cam.com/play/PLNsnyJYWmvugVM5tpdfKLtFcPROCv6NqL.html
All the best,
Ryan
Thank you for the script!
I'm not a techie, but with your help, I managed almost all of it. The only issue I'm facing now is that instead of 3 posts in the middle row, I just see one on the left side (it looks like there is empty space for the other two posts next to it). Do you maybe have any idea for me, what I did wrong? Thank you.
Hi Sylvia,
Thank you for your comment.
Can you share a link so I can have a look why you are having this issue. If you would prefer to share the link privately, please send it to divigeek@gmail.com.
Regards,
Ryan
@@divigeek Thank you so much for your support Ryan, I just send you an email.
Hi Sylvia,
Thank you. I have responded.
Regards,
Ryan
@@divigeek Thank you so much for your help. I'm so happy it works. 🙏 The slider looks awesome now.
Hi Sylvia,
I'm glad it worked.
All the best,
Ryan
Hola, coloque el código pero no me sirvió, no se hacen en 3 las entradas de blog
Hi @JordyCoopelesca,
Please can you post or email me a link to your website so I can try help you.
Thank you,
Ryan
I want six posts to be shown in the same time instead of three and on scroll to be shown another six posts. How to achieve that?
Hi @baltazarmilanov,
I'll have to have a look at the code again. Please can you send me a link to your web page.
Please note that I will only be able to look at this in the next couple of weeks due to tight deadlines.
Maybe check out my SwiperJS playlist, as this is more versatile.
th-cam.com/play/PLNsnyJYWmvugVM5tpdfKLtFcPROCv6NqL.html
Thanks,
Ryan
If it doesn't look right exit visual builder and refresh
Hi @user-vy1pe5og3o ,
Please can you send a link and I will try help you.
Regards,
Ryan