• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2665

Original Genesis Tutorials & 5000+ Guaranteed Code

Snippets

  • Support
  • Newsletter
  • Videos
  • Log in

Premium Member? - Request custom code

Altitude Pro Responsive MP4 Video Background For Front Page 1 Widget Area

The code in this tutorial enables you to add a fully mobile responsive WordPress hosted MP4 video background to the front page 1 widget area in the Altitude Pro child theme by StudioPress.

Update : Using Altitude Pro version 1.1.3 or newer? Try this tutorial instead.

Here’s the demo showing the full screen video tested at different screen widths using Chrome, Firefox & Safari browsers.

Mobile Responsiveness

The widget text wrapped in h2 tags and call to action buttons display on all mobile devices regardless of screen width. However, i have removed the widget title and small disclaimer from hand held’s as seen in the demo video above and screenshot below.

mobile-responsive

Front Page 1 Widget Setup

I used exactly the same widget content as the StudioPress theme setup recommends as seen in the following image:

front-page-1

Uses this HTML

Here’s the full solution for logged in members:

Register for full access

Altitude Pro Theme Video

Reader Interactions

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

PHP Code

template_include

get_body_class

if else

array

class_exists

foreach

sprintf

add_action

printf

variable

Advertise · WPEngine · Genesis · Log in

  • How Premium Membership Works
  • Sign Up
  • Support
  • Subscription Details/Invoice
  • Tagged Tutorials
  • Access-Download Problems