WordPress.org

Ready to get started?Download WordPress

Forums

YouTube Sidebar Plugin
[resolved] Centering Videos (3 posts)

  1. muchelleb
    Member
    Posted 5 months ago #

    Hey

    I really like your plugin, and it works well - this might be a stupid question, but is there any way to center to videos in my sidebar? I don't really like how they look when they're formatted to the left

    https://wordpress.org/plugins/youtube-sidebar/

  2. WebTechGlobal
    Member
    Plugin Author

    Posted 5 months ago #

    Hello

    Thank you. I plan to do more with the plugin. Just waiting for it to build up more users and try to work in a direction that people want/need.

    What your asking is a case of styling really. I can get the video in a div by default. Going to have a look at it right now for you.

  3. WebTechGlobal
    Member
    Plugin Author

    Posted 5 months ago #

    I thought I would point out some technical stuff. If you or anyone wants to add a little html to the video. Say a <div> with CSS styling to center it.

    Go to include/yts_public_functions.php

    Currently line 143 you will find a function named yts_video_object(). That is where more html should be added. Currently it looks like this...

    echo '<object width="'.$width.'" height="'.$height.'">
        <param name="movie" value="http://www.youtube.com/v/'.$videoid.$color.$border.'"></param>
        <param name="allowFullScreen" value="'.$fullscreen.'"></param>
        <param name="allowscriptaccess" value="always"></param>
        <embed src="http://www.youtube.com/v/'.$videoid.$color.$border.'" type="application/x-shockwave-flash"
        allowscriptaccess="always" allowfullscreen="'.$fullscreen.'" width="'.$width.'" height="'.$height.'"></embed>
        </object>';

    and we want it to look something like...

    echo '<div style="text-align:center"><object width="'.$width.'" height="'.$height.'">
        <param name="movie" value="http://www.youtube.com/v/'.$videoid.$color.$border.'"></param>
        <param name="allowFullScreen" value="'.$fullscreen.'"></param>
        <param name="allowscriptaccess" value="always"></param>
        <embed src="http://www.youtube.com/v/'.$videoid.$color.$border.'" type="application/x-shockwave-flash"
        allowscriptaccess="always" allowfullscreen="'.$fullscreen.'" width="'.$width.'" height="'.$height.'"></embed>
        </object></div>';

    What is new is the <div> at the beginning and one at the end, within the single quotes. This is the quickest fix, not the best really. The best approach is a CSS rule that is stored in a .css file. Even better, make use of WordPress styles or theme styles for perfection.

    Anyway I've added this quick solution while I'm at it. The plugin will eventually get a big update anyway and I'll improve the CSS options but this change will not suit everyone. This plugin is on a list for re-development using my new plugin core which has responsive interface and uses classes instead of functions.

Reply

You must log in to post.

About this Plugin

About this Topic

Tags