WebsiteBaker Community Forum
WebsiteBaker Support (2.13.x) => General Help & Support => Topic started by: rumen on April 26, 2024, 08:51:38 PM
-
Hi there,
any idea which module I can use to make a "partners logo carousel" like that one (https://codepen.io/mdashikar/pen/VWPvgE)? I try to implement that script, but all crashed.
Thanks in advance!
-
Hi, this should be possible with modules like OFA, itemz, topics.
All modules with a loop. Put your code in the footer, adjust the html in the loop template.
You need no detail pages, therefore itemz is maybe the best choice.
-
Where can I get that module? I couldn't find it here (http://www.websitebakers.com/search/index.php?search_path=&string=itemz&match=all).
-
Try the attached version
There are some predifined templates called "Presets" in settings. Some sliders are there . Maybe you don't need your linked script.
And please forget the linked websitebakers dot com, this is not a valid or official addon site.
The right site is https://addon.WebsiteBaker.org
-
Hi there,
any idea which module I can use to make a "partners logo carousel" like that one (https://codepen.io/mdashikar/pen/VWPvgE)? I try to implement that script, but all crashed.
hi my friend
your question tells me, that you've a favorite module for that. Maybe you can send me a backup from the used module with your changes and also from the used database tables. i'm sure, we can find a solution for that
Regards Uwe
-
only a idea....
I built a slider like this for the bakery shop a long time ago. It read the articles and made a slider out of them. And there were various options for the number of images and random display or not. it was a snippet, but a droplet is also no problem
-
Well. I solved the issue like that. It works.
Thanks all!
-
What is your solution?
Maybe other users have the same wish.
-
It is external code that I put in "CODE2" module with all necessary CSS styles inside. Here is the code.
<style>
* {
margin: 0;
padding: 0;
}
body {
background: #e6ebf1;
/* height: 40vh; */
}
.slider-area h3 {
text-align: center;
/* font-family: impact; */
/* font-size: 60px; */
/* font-weight: 500; */
/* text-transform: uppercase; */
/* letter-spacing: 2px; */
margin: 50px 0 50px 0;
/* color: #fff; */
}
.wrapper {
display: flex;
width: 100%;
margin: 0 auto;
overflow: hidden;
border-radius: 110px;
padding: 1.5rem;
background: #e6ebf1;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.item {
animation: animate 25s alternate linear infinite;
max-width: 100%;
height: auto;
}
.container:hover .item {
animation-play-state: paused;
}
@keyframes animate {
0% {
transform: translate3d(0, 0, 0);
}
100% {
transform: translate3d(-400px, 0, 0);
}
}
@media (max-width:767px) {
.slider-area h2 {
font-size: 30px;
}
.wrapper {
width: 95%;
border-radius: 0;
padding: 0;
}
}
</style>
<div class="slider-area">
<h3>Our partners</h3>
<div class="wrapper">
<div class="item"><img alt="" src="https://skylog.bg/media/logotest1.png"></div>
<div class="item"><img alt="" src="https://skylog.bg/media/logotest2.png"></div>
<div class="item"><img alt="" src="https://skylog.bg/media/logotest3.png"></div>
<div class="item"><img alt="" src="https://skylog.bg/media/logotest4.png"></div>
<div class="item"><img alt="" src="https://skylog.bg/media/logotest1.png"></div>
</div>
</div>
<br>
-
i have a rebuild from the old Swiftgallery and add this Slider as a additional template, it works, butthere is a little bit more to do, for example a switcher for the template or for the output like the switch in the Glossary/Faq-Module. The Swiftgallery reads all pictures from a single folder and display it normalize with a big mainpicture and small thumbs on a side.
(https://i.gyazo.com/a2bec2a4556a900fd7a321b4b1907fcd.png)
or a short video (https://gyazo.com/a2bec2a4556a900fd7a321b4b1907fcd)