WordPress カラムブロックの作り方 クラッシックエディター

前書き

WordPressでカラムブロックを使いたい時がある、自分は「クラッシックエディター」を使っている、そこでその時の使い方を学んでみた。

３カラムで横並びの作り方を学ぶ

まず、カラムブロックを作るためには、事前に、プラグイン「Shortcodes Ultimate」をインストールしておく必要がある。
下記記事を参照

WordPress プラグイン「Shortcodes Ultimate」の「ショートコードを挿入」の使い方

３分割カラムを設置例

１，カラムを設置したいケ所にカーソルを置く。

２，「ショートコード挿入」を選ぶ

３，「カラム」が２個有るが、左の「カラム」を選ぶ

４，次のコードが挿入される

[su_row][/su_row]

５，su_rouと/su_rowの間にカーソルを置き、「ショートコード挿入」から右の「カラム」を選ぶ。

次のウインドウが表示されるので、サイズを １/３ にし、下の「ショートコード挿入」を押す。

６，次のコードが挿入される

[su_row][su_column size="1/3"][/su_column][/su_row]

これを後２回実施する。
結果は次のようになる

[su_row][su_column size="1/3"][/su_column][su_column size="1/3"][/su_column][su_column size="1/3"][/su_column][/su_row]

７，３個各々のカラムに画像を挿入してみた。

まとめ（クラッシックエデイターの場合）

参考にして頂いた記事やサイト

WEBST8のブログ

 

23 Users

100 Pockets

【2021年版】WordPressブロックエディターの使い方総まとめ

https://webst8.com/blog/wordpress-block-editor/

本記事では、WordPress(ワードプレス)5.x系から標準エディタとなった「ブロックエディター」の使い方を解説していきます。   WordPressの投稿や固定ページで使うエディターの使

日々ぶろぐ

 

1 Pocket

写真を横並び、Shortcodes Ultimate を使ってカラムをつかいこなそう。

https://hibiblog-life.com/how-to-use-shortcodes-ultimate/

ゼロからわかるホームページの作り方

 

1 User

1 Pocket

ショートコードのソースをそのままテキスト文字列として表示したい

https://tart.co.jp/wordpress-shortcode-disp-text/

WordPressのショートコードをテキストのまま文字列として表示したいWordPressのショートコードは記事内に埋め込んで表示を出力させるためにとても便利なものですが、使い方の記事などを書く際にはショートコードを実行せずにそのままソース