試圖創建一個網格/列的簡碼

Question

我一直在來回走動，做了大量的試驗和錯誤。我想要輸出的是網格/列簡碼。

例如[grid_4] Lorem存有[/ grid4]

到目前爲止，這是我想出了

/*Grid Shortcode*/ 
function grid_one($content = null) { 
    return '<div class="one columns">'.$content.'</div>'; 
} 

add_shortcode('column_one', 'grid_one'); 

時嘗試應用打開和關閉簡碼。我的文字似乎消失了。我正在使用骨架框架，我的CSS樣式表位於這個名爲「CSS」的文件夾中。

CSS/Skeleton.css

當我試圖創建一個clearfix簡碼。它似乎工作正常，沒有問題，它清除浮動元素。這是代碼。

//Clear Shortcode 
function clear_fix($content = null) { 
    return '<div class="clearfix"></div>'; 
} 

add_shortcode ('clear', 'clear_fix'); 

和我的style.css位於根，而不是文件夾內

Answer 1

對不起，我有點你的榜樣confussed爲使用自己的[grid_4]作爲簡碼，但在功能上你示例將使用[column_one]作爲簡碼。 如果我理解正確，每個列寬都有不同的簡碼。 如果需要，您可以將它們組合成一個簡碼。 例如：

// column (grid) shortcode 
function my_col($params,$content=null){ 
    extract(shortcode_atts(array(
     'no' => '' 
    ), $params)); 
    return '<div class="col grid_'.$no.'">'.do_shortcode($content).'</div>'; 
} 
add_shortcode("col", "my_col"); 

所以，如果你有一個12列電網，這將被用於像這樣：

[col no="6"] This is the first column [/col] 
[col no="6"] This is the second column [/col] 

您也可以在一排容器包裝這個清算像這樣：

[row] 
    [col no="6"] This is the first column [/col] 
    [col no="6"] This is the second column [/col] 
[/row] 

該行的簡碼爲：

// row shortcode 
function my_row($atts, $content = null){ 
    return '<div class="row">'.do_shortcode($content).'</div>'; 
} 
add_shortcode("row", "my_row"); 

最後我找到一個有很多麻煩與WordPress自動添加段落，並打破標籤，所以我添加以下的functions.php

// Help clean up automatic paragraph tags 
remove_filter('the_content', 'wpautop'); 
add_filter('the_content', 'wpautop' , 12);