latest stable versions: v150827 (changelog)

Old Forums (READ-ONLY): The community now lives at WP Sharks™. If you have an s2Member® Pro question, please use our new Support System.

S2Stream Shortcode – Width Percentage

Home Forums Community Forum S2Stream Shortcode – Width Percentage

This topic contains 6 replies, has 3 voices. Last updated by  Todd 3 years, 9 months ago.

Topic Author Topic
Posted: Thursday Mar 14th, 2013 at 1:51 am #44572
Username: tdaubs

I’m trying to pass a percentage for the width and height using the S2Stream shortcode. However, it doesn’t appear to honor values with a percentage sign.

If I use this…




It strips the percentage signs out. So I end up with browser source code like

width: 100,
height: 100,

Am I doing something wrong?

List Of Topic Replies

Viewing 6 replies - 1 through 6 (of 6 total)
Author Replies
Author Replies
Posted: Thursday Mar 14th, 2013 at 9:41 pm #44663
Username: tdaubs

Any insight on what I need to do different is greatly appreciated.

Posted: Saturday Mar 16th, 2013 at 11:48 pm #44952
Username: tdaubs

I was able to find a work around until S2Stream can support width and height percentages. The reason I want to use percentages is that I want the video to be responsive. In order to implement a responsive video I am implementing the process similar to the method presented here.

One of the requirements of this method is to have the video width and height attributes set to 100%.

As of version v130221, S2Members S2Stream shortcode doesn’t (evidently) support percentages in the width and height values. If you use a percent sign in width and height it’s stripped out. To bypass this limitation, I duplicated the shortcode file jwplayer-v6-rtmp.php found at /wp-content/plugins/s2member/includes/templates/players and renamed the new file jwplayer-v6-rtmp-responsive.php.

Find the line

height: %%player_height%%,

and replace with

height: '%%player_height%%%',

Then find

width: %%player_width%%,

and replace with

width: '%%player_width%%%',

Now when using the shortcode, I can use 100 for the width and height and it will honor the extra percentage sign we added in the new shortcode.

[s2Stream player="jwplayer-v6-rtmp-responsive" player_path="/jwplayer/jwplayer.js" file_download="myfile.mp4" player_width="100" player_height="100" player_key="myplayerkeycodehere" download_key="true" file_type="mp4" player_id="s2_stream_video" player_stretching="fill" /]

Finally, I’m using the FitVids for WordPress plugin. After activating the plugin, in it’s settings in the field for jquery CSS selector I’m using #wrapper. For the FitVids custom selector I’m using s2_stream_video_wrapper.

In my CSS, I add…

#s2_stream_video_wrapper {
    width: 100%;
    position: relative;
    padding: 0;
    padding-bottom: 75%;
#s2_stream_video_wrapper object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

Please note, as pointed out in the above linked article, you will likely need to change the padding-bottom value in your CSS. The way to get that number is to divide the height/width of the source video and then multiply by 100. (height / width * 100 = percentage) The final number is the padding-bottom percentage you should use.

This method provides a responsive video using S2Member’s S2Stream shortcode with JWPlayer.

One final note, this will only work on pages with a single video and not on pages with multiple videos.

Posted: Sunday Mar 17th, 2013 at 8:01 pm #45007
Username: Bruce
Staff Member

Thank you for reporting this important issue.

We are very sorry for the delay.

I’m putting in a request to have this looked at in the next maintenance version of s2Member. I can confirm that s2Member ignores percent signs (%).

Posted: Thursday Mar 21st, 2013 at 3:09 am #45303
Staff Member

Thanks for the heads up on this thread :-)

The documentation for JW Player does not allow a percentage-based width or height. However, it seems from the example that JW Player may let them slide; even though it’s undocumented. I’m adding support for this into the next maintenance release.

I’m also adding a new class attribute to all JW Player template files: class="s2member-jwplayer-v6"

These changes will be documented in the changelog for the next release. Please allow one or two days for this to come out. Thanks!

Thanks for reporting this!

Posted: Thursday Mar 21st, 2013 at 3:11 am #45306
Staff Member

Once the next release is made available, a percentage-based width/height would need to be specified like this:

player_width="'100%'" (using single quotes to encapsulate the value)

Scratch this. It won’t be necessary. Using player_width="100%" will suffice in the development copy. This will be released officially in the next day or two.

Posted: Saturday Mar 23rd, 2013 at 5:55 pm #45569
Username: tdaubs

Thanks Jason. It will be nice to have this functionality in S2Stream.

Viewing 6 replies - 1 through 6 (of 6 total)

This topic is closed to new replies. Topics with no replies for 2 weeks are closed automatically.

Old Forums (READ-ONLY): The community now lives at WP Sharks™. If you have an s2Member® Pro question, please use our new Support System.

Contacting s2Member: Please use our Support Center for bug reports, pre-sale questions & technical assistance.