Change from SVG's to images in Logo slider form "Modern sliders"

[Sandberg]

Hi,

I’m trying to change from SVG’s to images in the Logo slider but I can’t get it to work. I looked into the previous posts and from what I understand, I should remove the “raw content” element and replace with an “image” element and then supply the image URL with the dynamic content {{dc:looper:field key=“image”}}. I don’t understand how to do this last part though and I can’t find any explanation that isnt in a secure note about this.

Would you mind elaborating on how to change from SVG’s to images?

Thanks in advance!

[prakash_s]

Hello @Sandberg,

Thanks for writing to us.

Please have a look at the given thread to learn more about how to change the SVG to the image.

If the above suggestion does not help, we would love to check your slider settings. Please provide us access to your site. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Exact Page URL
- Confirmation that we can access and make changes to your site
​

To know how to create a secure note, please check this out: How The Forum Works

Thanks

[Sandberg]

@prakash_s

note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Exact Page URL

Hi again,

I looked at that thread and I didn’t understand this part:

You can then use the {{dc:looper:field key="image"}} as the image source.

After I remove raw content and add an image (or several)? where do I put this? I want to have ~10 logos rolling.

[prakash_s]

Hello @Sandberg,

You need to click on this icon of the image element to open the dynamic content code list then select the Looper field and add the key of the image source.

There is another way as well. Click on the Hamburger menu icon—>Prefreances —> Scroll down and enable the Dev ToolKit

Now select the image element —>Click here Dev ToolKit icon—>Scroll down and add the dynamic content code here in the Image source box

Hope it helps
Thanks

[Sandberg]

Thanks for the explanation! I added the looper field and {{dc:looper:field key=“image”}} as the image source but how do I decide what images should appear in the slider now?

[tristup]

Hi @Sandberg,

The image should be mentioned in your Looper Data something like the JSON shown in the following article. And when it loops, it shows the image mentioned in the image attribute.

Loopers | Themeco Docs

The JSON might look like the following one.

[
    {
        "name"        : "Kari Rasmussen",
        "image"       : "<image url>",
        "accent"      : "#ea4335"
    },
    {
        "name"        : "Azul Baldwin",
        "image"       : "<image url>",
        "accent"      : "#1876f2"
    },
]

Hope it helps.
Thanks

[Sandberg]

Hi again,

I can’t seem to make it work so I created a user for you and gave you info in a secure note.

Would be really appreciated if you could take a look!

[tristup]

Hi @Sandberg,

I have checked and found that your JSON data has some formatting issues and added an extra comma at the end of the data, which is the reason behind why the Slider structure has not been created. I went ahead and fix the problem and set the image as suggested by my colleague and it worked.

Thanks