{"id":3876,"date":"2022-04-27T10:51:39","date_gmt":"2022-04-27T05:21:39","guid":{"rendered":"http:\/\/blog.wpoven.com\/?p=133"},"modified":"2022-04-27T10:51:39","modified_gmt":"2022-04-27T05:21:39","slug":"how-to-make-your-theme-compatible-with-wpbase-video-plugin","status":"publish","type":"post","link":"https:\/\/www.wpoven.com\/blog\/how-to-make-your-theme-compatible-with-wpbase-video-plugin\/","title":{"rendered":"How to make your theme compatible with &#8220;WordPress Video Tube Plugin&#8221; plugin"},"content":{"rendered":"<p><a href=\"http:\/\/wordpress.org\/plugins\/wpbase-video\/\" target=\"_blank\" rel=\"nofollow noopener\">WordPress Video Tube Plugin<\/a>\u00a0is a Video Hosting Plugin used to add videos from any site quickly and easily and helps you create your own video tube or video gallery site.<\/p>\n<p>The plugin was build by us because there were no free plugins to help you build a video gallery and the ones which were free just didn&#8217;t cut it.<\/p>\n<p>At <a href=\"http:\/\/www.wpoven.com\">WPOven<\/a> we already have compatible premium video themes ready to be installed in your site with just a few clicks (<em>No coding knowledge or editing needed<\/em>).<\/p>\n<p>But if you are comfortable with a little editing and prefer to do it yourself, you can follow the tutorial below and make your theme compatible with wpbase-video or you can try our very own theme <em><strong><a title=\"BA-Tube, New Video Theme for WordPress\" href=\"https:\/\/www.wpoven.com\/blog\/ba-videotube-new-video-theme-for-wordpress\/\">BA-Tube<\/a>\u00a0<\/strong><\/em>theme<strong>\u00a0<\/strong>for free, which is already 100% compatible with WordPress Video Tube Plugin.<\/p>\n<p>You can easily make any video theme compatible with wpbase-video using the following \u00a0simple steps:<\/p>\n<p>Before beginning copy<!--more--> the following files from the wpbase-video plugin folder (i.e \/wp-content\/plugins\/wpbase-video) to your theme folder \u00a0(i.e \/wp-content\/themes\/<em>your-theme-name<\/em>)\u00a0:<\/p>\n<ul>\n<li><span style=\"line-height: 16px;\">\/wp-content\/plugins\/wpbase-video\/css\/<em><strong>videocss.css<\/strong><\/em><\/span><\/li>\n<li>\/wp-content\/plugins\/wpbase-video\/images\/<em><strong>timebg.png<\/strong><\/em><\/li>\n<\/ul>\n<p>To add ratings to your videos, we recommend you use <strong>WP-PostRatings<\/strong>\u00a0plugin.<\/p>\n<h2><strong>Making the homepage compatible :<\/strong><\/h2>\n<h4><strong>1. Replace the thumbnail-code on the front page (usually &#8220;index.php&#8221; in your theme folder) with :<\/strong><\/h4>\n<h2><\/h2>\n<pre class=\"lang:php decode:true\">&lt;a href=\"&lt;?php the_permalink(); ?&gt;\" rel=\"bookmark\"&gt;\r\n\r\n &lt;?php if(has_post_thumbnail()){?&gt;\r\n &lt;?php the_post_thumbnail('entry-thumb', array('class' =&gt; 'entry-thumb')); ?&gt;\r\n &lt;?php } else { ?&gt;\r\n &lt;?php $img_url = get_post_meta(get_the_ID(), 'video-thumb', TRUE); ?&gt;\r\n &lt;?php if($img_url != null) { ?&gt;&lt;img width=\"320\" height=\"240\" src=\"&lt;?php echo $img_url; ?&gt;\" alt=\"&lt;?php the_title(); ?&gt;\" class=\"entry-thumb\"\/&gt;&lt;?php } ?&gt;\r\n &lt;?php } ?&gt;\r\n &lt;\/a&gt;<\/pre>\n<p>&nbsp;<\/p>\n<h4><strong>2. Add Time to the thumbnails :<\/strong><\/h4>\n<p>Copy the following code, in continuation, where the thumbnail code ends :<\/p>\n<pre class=\"lang:php decode:true\">&lt;?php if (get_post_meta(get_the_ID(), 'video-time', true)) { ?&gt;\r\n &lt;small class=\"time\"&gt; &lt;?php\r\n if ((get_post_meta(get_the_ID(), 'video-time', true)) &gt; 3599) {\r\n echo gmdate(\"H:i:s\", get_post_meta(get_the_ID(), 'video-time', true));\r\n } else {\r\n echo gmdate(\"i:s\", get_post_meta(get_the_ID(), 'video-time', true));\r\n }\r\n ?&gt; &lt;\/small&gt;\r\n &lt;?php } ?&gt;<\/pre>\n<p><strong>\u00a0<\/strong><\/p>\n<h4><strong>3. If you want to add video views to the homepage :<\/strong><\/h4>\n<p><strong>add the following code in the index.php file :<\/strong><\/p>\n<pre class=\"lang:php decode:true\">&lt;div class=\"entry-meta\"&gt; &lt;span class=\"entry-comment\"&gt; Views : &lt;?php do_action('dispview'); ?&gt; &lt;\/span&gt; &lt;\/div&gt;&lt;!-- .entry-meta --&gt;<\/pre>\n<p><span style=\"font-family: Consolas, Monaco, monospace; font-size: 12px; line-height: 18px;\">\u00a0<\/span><\/p>\n<p><strong>4. Add Rating for videos (works with <strong>WP-PostRatings plugin)<\/strong>\u00a0:<\/strong><\/p>\n<pre class=\"lang:php decode:true\">&lt;?php if (function_exists('the_ratings')) {\r\n the_ratings();\r\n } ?&gt;<\/pre>\n<h2><\/h2>\n<h2><strong>Making the SINGLE POST PAGE or Viewing single Video page (usually it is single.php) compatible :<\/strong><\/h2>\n<h4><strong>1. Add Video (Embed code) :<\/strong><\/h4>\n<pre class=\"lang:php decode:true\">&lt;?php\r\n $embed = get_post_meta(get_the_ID(), 'video-code', TRUE);\r\n if ($embed) {\r\n ?&gt;\r\n &lt;div class=\"entry-embed\"&gt;\r\n &lt;?php \/\/echo wp_oembed_get( $embed, array( 'width' =&gt; 400 ) );\r\n echo stripslashes(htmlspecialchars_decode($embed));\r\n ?&gt;\r\n &lt;\/div&gt;&lt;!-- .entry-embed --&gt;\r\n &lt;?php\r\n }\r\n ?&gt;<\/pre>\n<h4><strong>2. \u00a0Add views, time and ratings for video<\/strong><\/h4>\n<pre class=\"lang:php decode:true\"> \r\n &lt;span class=\"entry-comment\"&gt;\r\n Views : &lt;?php \/\/echo do_shortcode('[post_view]'); \r\n do_action('custhook');\r\n ?&gt;\r\n &lt;\/span&gt;\r\n &lt;span class=\"entry-comment\" style=\"padding-right:10px\"&gt;\r\n Length : &lt;?php\r\n if ((get_post_meta($post-&gt;ID, 'video-time', true)) &gt;= 3600) {\r\n echo gmdate(\"H:i:s\", get_post_meta($post-&gt;ID, 'video-time', true));\r\n } else {\r\n echo gmdate(\"i:s\", get_post_meta($post-&gt;ID, 'video-time', true));\r\n }\r\n ?&gt;\r\n &lt;\/span&gt; \r\n&lt;?php if (function_exists('the_ratings')) {\r\n the_ratings();\r\n } ?&gt;<\/pre>\n<h3><strong>3. Truncate description of Video (i.e &#8216;view more&#8217; or &#8216;view less&#8217; options):<\/strong><\/h3>\n<pre class=\"lang:php decode:true\">&lt;?php \r\n$permalink = ' &lt;a class=\"desc-a-vid\"&gt;Read More\u2026&lt;\/a&gt;';\r\n$truncateContent = truncate::doTruncate(strip_tags(get_the_content(), \"\"), 300, '.', $permalink); ?&gt;\r\n&lt;div class=\"desc-p-vid\"&gt;\r\n&lt;?php echo $truncateContent; ?&gt;\r\n&lt;\/div&gt; \r\n&lt;div class=\"desc-p-cont\" style=\"display: none\"&gt;\r\n&lt;?php the_content(); ?&gt;\r\n&lt;a class=\"hide-vid\"&gt;Read Less&lt;\/a&gt;\r\n&lt;\/div&gt;<\/pre>\n<h5>and add this in <strong>functions.php<\/strong> file in theme folder:<\/h5>\n<pre class=\"lang:php decode:true\">class truncate {\r\npublic static function doTruncate($truncateString, $limit, $break = \".\", $pad = \"\u2026\") {\r\n\/\/ return with no change if string is shorter than $limit&amp;nbsp;if (strlen($truncateString) &lt;= $limit)\r\n return $truncateString;\r\n\/\/ is $break present between $limit and the end of the string?\r\n if (false !== ($breakpoint = strpos($truncateString, $break, $limit))) {\r\n if ($breakpoint &lt; (strlen($truncateString)) - 1) {\r\n $truncateString = substr($truncateString, 0, $breakpoint) . $pad;\r\n }\r\n }\r\n return $truncateString;\r\n }\r\n}<\/pre>\n<h5>and add the following javascript :<\/h5>\n<pre class=\"lang:js decode:true\">jQuery(\".desc-a-vid\").click(function(){\r\n jQuery(\".desc-p-vid\").hide();\r\n jQuery(\".desc-p-cont\").show(700);\r\n jQuery(\".desc-a-vid\").hide();\r\n});\r\n jQuery(\".hide-vid\").click(function(){\r\n jQuery(\".desc-p-cont\").hide();\r\n jQuery(\".desc-p-vid\").show();\r\n jQuery(\".desc-a-vid\").show();\r\n });<\/pre>\n<p>&nbsp;<\/p>\n<p><em><strong>\u00a0Everything done but\u00a0don&#8217;t\u00a0see the things at the right place or right size ?<\/strong><\/em><\/p>\n<p>Open the <strong>videocss.css<\/strong> file and adjust the values of the lines with comment &#8220;<strong><em>\/\/adjust this acc to theme<\/em><\/strong>&#8220;.<\/p>\n<p>&nbsp;<\/p>\n<p><em><strong>Still can&#8217;t get it to work for you ?<\/strong><\/em><\/p>\n<p>We give free support to <a href=\"http:\/\/www.wpoven.com\">WPOven <\/a>users, just drop us a ticket and we will be happy to help.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>WordPress Video Tube Plugin\u00a0is a Video Hosting Plugin used to add videos from any site quickly and easily and helps you create your own video tube or video gallery site.<br \/>\nThe plugin was build by us because there were no free plugins to help you build a video gallery and the ones which were free just didn&#8217;t cut it.<br \/>\nAt WPOven we already have compatible premium video themes ready to be installed in your site with just a few clicks (No coding knowledge or editing needed). &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/www.wpoven.com\/blog\/how-to-make-your-theme-compatible-with-wpbase-video-plugin\/\" class=\"more-link\">Read More <i class=\"fa fa-angle-double-right\" aria-hidden=\"true\"><\/i><span class=\"screen-reader-text\"> &#8220;How to make your theme compatible with &#8220;WordPress Video Tube Plugin&#8221; plugin&#8221;<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ub_ctt_via":"","footnotes":""},"categories":[9,10],"acf":[],"featured_image_src":null,"author_info":{"display_name":"Vikrant Datta","author_link":"https:\/\/www.wpoven.com\/blog\/author\/vikrant\/"},"_links":{"self":[{"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/posts\/3876"}],"collection":[{"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/comments?post=3876"}],"version-history":[{"count":2,"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/posts\/3876\/revisions"}],"predecessor-version":[{"id":13011,"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/posts\/3876\/revisions\/13011"}],"wp:attachment":[{"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/media?parent=3876"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wpoven.com\/blog\/wp-json\/wp\/v2\/categories?post=3876"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}