[Plugin: JW Player Plugin for WordPress] Centering and other effects through CSS

  • Sandro Bilbeisi

    (@sandrobilbeisi)


    15 years ago

    Centering and other effects through CSS
    JW Player Plugin for WordPress

    Currently the player won’t center or accept CSS styling because the embedding script strips away the DIV and rewrites it.

    Getting the player to center on the parent DIV in a configurable per-shortcode manner would require a significant number of changes that are best left to the LongTail development team.

    So here is a quick hack to enable centering globally for all players and any shortcode:

    After the plugin is activated and the update sequence is completed, a jwplayer.js will be created at:

    /wp-content/uploads/jw-player-plugin-for-wordpress/player/jwplayer.js

    this is a minified javascript, so edit with care…
    we will inject the code
    margin:"0 auto",

    at offset 40417 of jwplayer.js , so

    a.utils.css(x,{position:"relative",width:m,height:v})

    becomes

    a.utils.css(x,{margin:"0 auto",position:"relative",width:m,height:v})

    live demo with additional effects (WebKit shadows)

    *later I’ll add a ‘reflection’ effect and an Ambilight effect (requires additional ActionScript and CanvasJS hooks)

    cheers,
    Sandro Bilbeisi

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author JW Player

    (@longtail-video)

    15 years ago

    Hi Sandro,

    It should be possible to place a div around the shortcode when editing your post in HTML mode. This should give you a div to style after the embed has been done.

    Although I understand that you wouldn’t want to add this in every time. So we’ll look into adding an option in a future update.

    Thanks.

    jjwalker

    (@jjwalker)

    14 years, 11 months ago

    Thank you Sandro for the hack, it works very nicely. I would prefer a cleaner LongTail solution that will allow css options to be specified in the “manage players” section. That would allow people comfortable with the visual editor in wordpress to easily use a shortcode and get proper formatting.

    Plugin Author JW Player

    (@longtail-video)

    14 years, 11 months ago

    Yeah, we’re looking into this. I think the primary issue is the position: relative on the wrapper div generated by the player itself. This style is currently necessary to support the JavaScript plugin model. We’re investigating a better solution.

    Thanks.

    Vcize

    (@vcize)

    14 years, 5 months ago

    I take it this never happened? I just downloaded the player and have been pulling my hair out while trying to center the images.

    Plugin Author JW Player

    (@longtail-video)

    14 years, 4 months ago

    Yes, this change hasn’t occurred. I’ve certainly mentioned it to the player team.

    However, the jwplayer div now receives the custom player name as a css class which helps somewhat in styling the player.

    Thanks.

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

The topic ‘[Plugin: JW Player Plugin for WordPress] Centering and other effects through CSS’ is closed to new replies.