WordPressで作ったWebページは、基本的にテーマが用意している見た目にそったものになります。
そのため、有名なテーマを使っていると、他の人が作ったサイトと同じような見た目に…
ですが世の中には、素晴らしい見た目にできるhtmlやcssを公開してくれていて、自分のサイトをオリジナルなものにすることができるのです。
しかしせっかく公開してもらっているhtmlやcssですが、それをWordPressに取り込むの方法がわからないという人も多いはず。
そこで、やり方を要点のみでお伝えします。
WordPressのバージョンによって方法が異なる
WordPressが5.0にアップデートしたタイミングで、投稿用のエディタが一新されました。
これにより、操作方法までもが変わってしまいました。
そのため、バージョンに合わせた方法を知る必要があります。
投稿画面がこちらなら、新しいエディタ(Gutenberg)です。
新しいエディタ(Gutenberg)でhtmlやcssをコピペする方法はこちら
こちらの画面なら、以前のエディタです。
以前のエディタ(Gutenberg)でhtmlやcssをコピペする方法はこちら
新しいエディタ(Gutenberg)の場合
(1) 右上の (+) をクリック
(2) フォーマット内のカスタムHTMLをクリック
(3) 表示された枠内に、HTMLを貼り付け
(4) cssを貼り付け
cssは <style></style>で囲んでコピペします。
テーマでページごとにスタイルを設定できる場合は、そちらにコピペします。
同じcssを記事内で複数回使用する場合は、一回だけでOKです。
以前のエディタ(Gutenberg)の場合
(1) 右上のタブを「ビジュアル」から「テキスト」に切り替えます。
※ビジュアルのままだと、入力したHTMLがそのまま表示されます
(2) HTMLを貼り付けます。
WordPressの自動整形について
WordPressの旧エディタは、入力されたHTMLを自動で整形します。
そのため、コピペしたHTMLがそのまま表示されないことがあります。
(3) cssを貼り付け
cssは <style></style>で囲んでコピペします。
基本的にはこれで問題ありませんが、余分な行などを入れると、自動整形により正常に動作しないケースがあります。
テーマでページごとにスタイルを設定できる場合は、そちらを利用するか、プラグインを利用してください。
■Googleで他サイト検索
■僕がおススメするアフィリエイト教材
■マーケティング施策ツール