內容塊爲WordPress的3.9.x主題shortcode插件

Question

我正在開發自定義的短代碼wordpress 3.9.x插件，但代碼無法正常工作。代碼應根據media =「image」或media =「video」等參數進行更改，並且應根據參數position =「left」或position =「right」添加css類。

如果圖片，路徑的值將是圖片url。 如果視頻，路徑的值將被YouTube嵌入代碼網址。

任何幫助？

短代碼是如下：

[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] 

守則如下：

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'); 

Answer 1

我與我的代碼做，效果很好。此代碼可以生成4種類型的簡碼。

簡碼：

[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] 

插件代碼：

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"); 

Answer 2

簡碼屬性，您在實際簡碼使用，並且已經在函數中使用的那些不同。這些屬性名稱應該相同才能工作。

下面是示例代碼：

// Add Shortcode 
function video_embed_shortcode($atts, $content = "") { 

    // Attributes 
    extract(shortcode_atts(
     array(
      'src' => '', 
      'width' => '', 
      'height' => '', 
     ), $atts) 
    ); 

    // Code 
return '<embed 
     src="' . $src . '" 
     width="' . $width . '" 
     height="' . $height . '" 
     type="application/x-shockwave-flash" 
     allowscriptaccess="always" 
     allowfullscreen="true">' . $content; 

} 
add_shortcode('video_embed', 'video_embed_shortcode'); 

簡碼爲上面會像：

[video_embed src="" width="" height=""]content[/video_embed]