STAX Hero Block

[Erich Fisher]

Hi all,

I am building my first new site after upgrading to STAX from the prior OT wordpress themes. Although I like STAX, the changes haven’t been as smooth as I had hoped.

I’m currently struggling with the Hero block. In my old OT theme (Startup), there was an option in the Hero widget to fix the position of the background image so that it created a parallax effect as other content scrolled above it–see example at to the top of my page here: https://p5project.org

How do I do this in STAX though? I can’t figure it out and it’s driving me nuts.

Also, in the old Hero widget (or maybe the Startup theme), the Organic Hero text faded in with a very slight delay. It looked really nice because everything didn’t just appear abruptly. I never modified the CSS or anything else to make it do that, but is there a way to replicate this in STAX too?

Thanks so much!

Erich

[David Morgan]

Hi Erich,

The parallax functionality was a limitation of the Hero Block in the Organic Blocks plugin, and not directly related to STAX. But you bring up a great point, so we have added the parallax functionality to the Hero Block in the Organic Blocks plugin. After updating to version 2.0.5, you should see the new option in the Hero Block to display a parallax custom image.

Regarding text fading in, this can be achieved by adding the following custom CSS:

h1, h2 {
  margin: 0;
  opacity: 0;
  animation: fadein ease-in 1s;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

I hope this helps. Thanks!

[Jeffrey]

It appears the Stax theme uses a video in the hero block. That video is hosted in WordPress. Is there a way to host the video in Vimeo Pro? (the server my client is using restricts the file maximum file size to upload the video. So, we need to look at an alternative to where to host the video. Plus, we want the video to automatically play and loop continuously. How can we do that?

[David Morgan]

Hi Jeffrey,

There’s currently no option for Vimeo within the Hero Block. However, you can use YouTube by adding the YouTube Embed URL to the block. Then, within the YouTube settings you should be able to set the options to autoplay and loop. The attached screenshot shows the field for the YoutUbe Embed link in the block.

I hope this helps.

Thanks!

Attachments:

You must be logged in to view attached files.

[Author]

Posts