テキストやボタンの配置を右寄せにしたい時

WordPressのバージョンが5.0に上がりブロックエディタというものできたので、テキストやボタンの配置は、以下の方法でなくても簡単にできるようになりました。

lightningのテーマでは、CSSフレームワークの定番であるBootstrapを採用していますので、クラス名をつけることで、あらかじめ設定された装飾を簡単に行うことができます。(Bootstrap参照

文章の下にボタンをつける場合やテキストの下に右寄せの文章を載せたい場合、クラス名に”pull-right”をつけることで、右寄せにすることが可能です。

右寄せにしたい場合は、クラス名に”pull-right”をつけましょう。

サンプル

テキストの右寄せ

詳細はこちら

ボタンの右寄せ

右寄せボタン

HTMLをコピペして使ってね。

□テキストリンクの場合

<a class="pull-right" href="#">詳細はこちら</a>

□ボタンリンクの場合

<a class="btn btn-default pull-right" href="#" >詳細はこちら</a>

 


その他・コピペで使えるBootstrapサンプル

コピペで使える「枠」の作り方
コピペで使えるボタンの装飾

この記事を書いた人

佐々木亜紀
佐々木亜紀
株式会社アドプラス 代表取締役 
千葉コワーキングスペース201オーナー

ウェブ制作10年、実店舗運営7年。
50万PV/月のメディア運営中
ワードプレス制作と実店舗運営の経験を生かしてワードプレスの基礎構築講座を主宰。

中小企業庁
ミラサポ専門家派遣事業登録専門家
千葉県産業振興センター登録専門家

マンツーマン + 動画付き

マンツーマンでじっくり4時間、あなたの事業内容に合わせてワードプレスの基本操作を学び、ホームページを専門家と一緒に作りましょう。

受講後も家で学べる動画付きですので、引き続き自分でホームページを作って行くことができます。

自宅で学ぶオンライン講座

千葉まで受講しにいけない!と言う方のための動画講座です。

動画40本(全4時間)を見ながら、自分のホームページを作っていくことができます。
わからない時はチャットで質問ができます。