Slider assistance required for show theme

Classic
1

Novice user needs assistance with slider banner in show. Cannot seem to get my images to display and replace the example ones. I changed the 1st slider to this:


to test but a blank image appeared on preview.

Below is the original code from the show theme tutorial

Page built with Stacks.

Show includes a FREE Stack called "Gridly" that you can use to create pages like this!

Learn More

Slide 2

Slide 3

Slide 4

Slide 5

2

To show code on here, highlight the code and click the </> button in the toolbar if the editor

1 Like
3

&lt;div id="myExtraContent1"&gt; &lt;div class="wt-slider"&gt; &lt;div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"&gt; &lt;div class="s-item"&gt; &lt;h1&gt;Page built with Stacks.&lt;/h1&gt; &lt;p&gt;Show includes a FREE Stack called "Gridly" that you can use to create pages like this!&lt;/p&gt; &lt;a href="#two" class="button scrolly"&gt;Learn More&lt;/a&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"&gt;&lt;div class="s-item"&gt;&lt;h1&gt;Slide 2&lt;/h1&gt;&lt;/div&gt;&lt;/div&gt; &lt;div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"&gt;&lt;div class="s-item"&gt;&lt;h1&gt;Slide 3&lt;/h1&gt;&lt;/div&gt;&lt;/div&gt; &lt;div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"&gt;&lt;div class="s-item"&gt;&lt;h1&gt;Slide 4&lt;/h1&gt;&lt;/div&gt;&lt;/div&gt; &lt;div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"&gt;&lt;div class="s-item"&gt;&lt;h1&gt;Slide 5&lt;/h1&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt;

thanks for your help - here is the code which I’m using from the show theme. I have the image I want to use in resources. When i replace (images/banners/banner_1.jpg)%) to (resources/banner_1)%) i get a blank. I guess I am doing it totally wrong.

4

Not sure how you put the code into the forum or your project.

<div id="myExtraContent1">
	<div class="wt-slider">
		<div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)">
			<div class="s-item">
				<h1>Page built with Stacks.</h1>
				<p>Show includes a FREE Stack called "Gridly" that you can use to create pages like this!</p>
				<a href="#two" class="button scrolly">Learn More</a>
			</div>
		</div>
		<div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"><div class="s-item"><h1>Slide 2</h1></div></div>
		<div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"><div class="s-item"><h1>Slide 3</h1></div></div>
		<div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"><div class="s-item"><h1>Slide 4</h1></div></div>
		<div class="s-slide" style="background-image:url(%pathto(images/banners/banner_1.jpg)%)"><div class="s-item"><h1>Slide 5</h1></div></div>
	</div>
</div>

Above is from http://preview.weaverthemes.com/show/extras/tutorials/

1 Like
5

Make sure you paste as plan text.
To use resources try
Replacing the entire url statement:
url(%pathto(images/banners/banner_1.jpg)%)
With:
url("%resource(my-image.jpg)%")

Change the my-image.jpg With the image name.

1 Like
6

Unfortunately it didn’t work but thanks for trying to help me.

7

I don’t have the theme you are using, a URL to the site might help. Can you post the code as you have it on the site?
Might contact the developer.

8

Thank you again - this is the tutorial that provides instructions to add the slider banner. http://preview.weaverthemes.com/show/extras/tutorials/

It works correctly with this code and his images but replacing the images with my own and making it work is proving an issue. I did email him but as yet have had no reply.

9

That’s why we need to see Your Code and your URL. There is something you are doing differently. I already referenced the tutorial URL above. When working with CSS, HTML, and inserting resources something as simple as a comma or bracket will “break” the site.

Without seeing what you have there’s no way to get help.

10

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.