Theme Venture - Would like Image in the Background with bulleted text in front.

Solved
New Member
4 0 0

I am using theme Venture them and trying to add images and textto our product pages to make them more informative.

I would like to put the following text over the top of an image that also sits over the page width

<div class="flex flex--center-vertical"></div>
<div class="page-width">
<div style="background: #ededed; padding-top: 1rem; padding-bottom: 1rem;">
<div class="text-width text-center">
<h3 style="margin-bottom: 2rem;" class="h1--mini section-block__title">ARE YOU READY FOR GAME ONN?</h3>
<ul class="ticks">
<li style="text-align: left;">Want to win the inner battle and rage against the ordinary?</li>
<li style="text-align: left;">Looking for greater concentration, focus and alertness, without the jitters?</li>
<li style="text-align: left;">Seeking enhanced learning, cognition and memory, without feeling wired?</li>
<li style="text-align: left;">What if you could enjoy greater reaction times and reflexes?</li>
<li style="text-align: left;">Improve physical stamina and power output without the crash?</li>
<li style="text-align: left;">What would you do with the strongest mental and physical boost on the market?</li>
</ul>
</div>
</div>
</div>

The specific piece of text I want is the bit below in the with the Grey Background, which I want to be replaced with an image.

 

Any guidance would be helpful, as I will also want to change the Runners Image which includes the text to be a Background Image with Text Overlay too.

 

I can currently display the text over background colours or have images to the left of text. As shown in the screenshot below:Screenshot 2019-12-12 at 16.53.25.png

0 Likes
Highlighted

Success.

Shopify Partner
644 132 152

Hello Onnor,

Change this line

<div style="background: #ededed; padding-top: 1rem; padding-bottom: 1rem;">

to this

<div style="background-image: url(Your image path);padding-top: 1rem;padding-bottom: 1rem;background-position: center center;background-repeat: no-repeat;">

don't forget to change 'Your image path' to actual image

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
2 Likes
Highlighted
New Member
4 0 0

Perfect - Exactly what I wanted - this will make the site look so much better and give more scope for other things!

 

Thank You

0 Likes