way to make parallax post image clickable?

[iempoweru]

I have looked in the forum and don’t see this topic.  I am creating a site with parallax posts for the home page.  I have included text in the image instead of overlaying it.  One of the things I added was a call for action button.  Instead of clicking on the button, I just want them to click on the image.

Here is the page in question:  https://beckyapark-global.com/

Thank you in advance.  I love everything about weaver xtreme plus themes.

 

[scrambler]

The parallax image is set as a background so it cannot be made clickabe.

What you need to do is add the Text as HTML in the manual excerpt box (if you created the area with a parallax post) looking like below

<a class="myparlink" href="http://msn.com">
All your content on several lines
<br/>All your content on several lines
<br/>All your content on several lines
<br/>All your content on several lines
</a>

Then add the CSS rule below to the theme Global Custom CSS Rule box to make the link area cover the image.

a.myparlink {display:inline-block;width:100%;}

#post-38-p .parallax-content {text-align:center;}

Once in place post back for final tuning

[iempoweru]

I read about these instructions in the documentation, but, I couldn’t find where to put the excerpt.  By accident I found it last night.  Duh.

It works great, although I did do some finetuning already.  I don’t have access to the main photo, so I just inserted a black background so I could play around with it.  I also created a button and made that the clickable element.  Now my only question is how do I play with up and down location of the text?  I think I will have it align left, but, I would like it to be further down on the image.

I love it and thank you again.

 

[scrambler]

For alignment and top padding and any other styling of that parallax content, use the rule I gave you (below) placed in the Theme Global Custom CSS Rule box

#post-38-p .parallax-content {text-align:left;padding-top:80px;}

[Author]

Posts