I am developing custom shortcode wordpress 3.9.x plugin but code doesn't work properly. Code should change based on the parameter like media="image" or media="video" and css class should add based on parameter position="left" or position="right".
If image, value for path will be image url. If, video, value for path will be youtube embed code url.
Any help?
Shortcodes is as below:
[contentblock class="gray" position="left" media="video" path="....youtube video link...."]Video[/contentblock]
[contentblock class="gray" position="left" media="image" path="....image url...." alt="alter text" ]Image[/contentblock]
Code is as below:
function contentposFun( $atts, $content = null ) {
extract( shortcode_atts( array(
"class" => '',
"path" => '',
"alt" => '',
"contentPos" => '', //Left, Right
"contentLeft" => '',
"mediaRight" => '',
"mediaType" => '', // Image, Video
"isImage" => '',
"isVideo" => '',
"imgCenter" => '',
), $atts, 'contentblock' ) );
if($contentPos == "left"){
$mediaRight = " col-md-push-7 ";
$contentLeft = " col-md-upll-5 ";
}
else {
$mediaRight = " ";
$contentLeft = " ";
}
if($mediaType == "image"){
$imgCenter = ' img_center';
$mediaType .= ' <img src="' .$path. '" alt="'.$alt.'" class="img-responsive"' . ' />';
}
else {
$mediaType .= ' <div class="flex-video widescreen"><iframe width="560" height="315" src="' .$path. '" frameborder="0" allowfullscreen></iframe></div>';
}
return '<div class="container-fluid '.$class.'">
<div class="row">
<div class="container full_height">
<div class="row full_height relative">
<div class="col-md-5' .$imgCenter. '' .$mediaRight.'">' .$mediaType. '</div>
<div class="col-md-7'.$contentLeft.'full_height absolute ">
<div class="table full_height">
<div class="table-row full_height">
<div class="table-cell full_height valign_middle">'
.do_shortcode($content).
'</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>';
}
add_shortcode( 'contentblock', 'contentposFun' );
I am done with my code and it works well. This code can generate 4 types of shortcodes.
Shortcode:
[conblock class="gray" pos="left" media="image" path="img1.png" alt="image text"] Content[/conblock]
[conblock class="white" pos="right" media="image" path="img1.png" alt="image text"] Content[/conblock]
[conblock class="gray" pos="left" media="video" path="//www.youtube.com/embed/A2ojlR2Rxiw"] Content[/conblock]
[conblock class="white" pos="right" media="video" path="//www.youtube.com/embed/A2ojlR2Rxiw"] Content[/conblock]
Plugin code:
function conblockFun( $atts, $content = null ) {
extract( shortcode_atts( array(
'class' => '', //white, gray
'pos' => '', //left, right
'media' => '', //image, video
'left' => '', // true, false
'right' => '', //true, false
'path' => '', // image path or video path
'alt' => '', // if image add alt text
), $atts, 'conblock' ) );
$output = '<div class="container-fluid '.$class.'">
<div class="row">
<div class="container full_height">
<div class="row full_height relative">';
if($pos == 'left' && $media == 'image') { $output .= '<div class="col-md-5 col-md-push-7 img_center"><img src="' .$path. '" alt="'.$alt.'" class="img-responsive"' . ' /></div><div class="col-md-7 col-md-pull-5 full_height absolute">';}
if($pos == 'left' && $media == 'video') { $output .= '<div class="col-md-5 col-md-push-7"><div class="flex-video widescreen"><iframe width="560" height="315" src="' .$path. '" frameborder="0" allowfullscreen></iframe></div></div><div class="col-md-7 col-md-pull-5 full_height absolute">';}
if($pos == 'right' && $media == 'image') { $output .= '<div class="col-md-5 img_center"><img src="' .$path. '" alt="'.$alt.'" class="img-responsive"' . ' /></div><div class="col-md-7 col-md-push-5 full_height absolute">';}
if($pos == 'right' && $media == 'video') { $output .= '<div class="col-md-5"><div class="flex-video widescreen"><iframe width="560" height="315" src="' .$path. '" frameborder="0" allowfullscreen></iframe></div></div><div class="col-md-7 col-md-push-5 full_height absolute">';}
$output .= '<div class="table full_height">
<div class="table-row full_height">
<div class="table-cell full_height valign_middle">'
.do_shortcode($content).
'</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>';
return $output;
}
add_shortcode("conblock", "conblockFun");