Adding Featured Video on Blog Homepage

NOTE: Starting with OptimizePress version 2.5.11 we introduced a newer theme that has a more modern design, faster loading pages, and better SEO. We would suggest trying out the new OptimizePress Smart Theme. If you have an active updates/support license you should see this in the members hub, along with a downloadable PDF step by step guide on how to use the new Smart Theme

We can no longer provide the older OptimizePress Theme files for download for new sites. If you have an existing site and need to re-install the theme files please contact our support team and they will gladly assist with that. For now, we will still provide updates and support for the older OptimizePress Theme

This guide is for the older OptimizePress Theme version and not for the new Smart Theme

1. Go to your specific Blog post editor and click on the Screen Options >> check on the "Excerpts" option.

pic1.jpg

2. At the bottom of the blog post text editor you will find the excerpt field.

pic2.jpg

3. Go to your YouTube video.

4. Click on the "Share" button below the video.

5. Click the "Embed" button next to "Share".

6. Copy the "iframe" code given and paste it into the Excerpt field of your blog post editor.

7. Insert or create an div class (<div class="video-container-ytube"> </div>) html code before the "iframe" code. Click update when done.

For Example:

<div class="video-container-ytube"><iframe width="560" height="315" src="https://www.youtube.com/embed/uXCVp7MIyNw" frameborder="0" allowfullscreen></iframe></div>

pic3.jpg

8. Then, go to OptimizePress >> click on Dashboard >> Global Setting >> Custom CSS >> insert the below code:

/*for mobile responsive of ytube*/<br />.video-container-ytube {<br />position: relative;<br />padding-bottom: 56.25%;<br />padding-top: 30px; height: 0; overflow: hidden;<br />}<br /> <br />.video-container-ytube iframe,<br />.video-container-ytube object,<br />.video-container-ytube embed {<br />position: absolute;<br />top: 0;<br />left: 0;<br />width: 100%;<br />height: 100%;<br />}

9. Click Save Setting when done.

feature_video.jpg