WordPressの自作テーマに挑戦してみよう！ 初めてでも意外と簡単？｜ワプ活
WordPressをしばらく運用していると、「もっと自由にデザインを変更してみたい」「機能を自分好みにカスタマイズしたい」と考える人も多いと思います。 そんなときは、自分自身でWordPressテーマを自作してしまうという方法があります。 テーマを自作すれば、1から100まで自分の理想を反映させたWebサイトを作ることができます。 WordPressテーマを自作するメリットは、運営するWebサイトに合った理想のデザインや機能を搭載できるということと、あとからでも機能の追加やデザインの変更がしやすいことです。 逆にデメリットとしては、時間と手間がかかることがあげられます。 WordPressテーマの自作は意外と簡単ではあるものの、HTMLやCSS、PHPの基礎知識に加え、WordPressの構造に関する知識があるといいでしょう。 本記事では、WordPressのテーマを自作する方法を解説しま
ブロックパターンを管理・編集できる「VK Block Patterns」
・同じブロックの組み合わせを簡単に使いまわしたい！ ・WordPressのデフォルトブロックは使いたくない！ ・自分で作ったパターンを登録したい！ Gutenberg のブロックは、HTMLやCSS を気にしなくて良い反面、同じブロックを何度も使うことに疲れてしまう、というなんとも怠惰な？感情に襲われる便利な機能です。 そこで、私が有料テーマでサブスクリプションにも関わらず愛してやまない Lightning G3 の開発元 Vektor.inc さんが開発されているプラグイン VK Block Patterns のをご説明致します！ ブロックパターンを登録する機能の名称は、各テーマによって異なります。 例えば、SWELL なら「ブログパーツ」。（Cocoonには同機能はありません） プラグインをインストールする前に、似たような機能がないか確認してみてくださいね。 この記事ではさらに、パター
WPテーマSuffusion（5）CSSのカスタマイズも簡単！テーマ更新されても変更必要なしに！
さて、今日のWordpressテーマ「Suffusion」のCSSのカスタマイズ方法です。スタイルを簡単に変更して、上書きできるのがいいですね。頻度の高い更新するテーマとしてかなり重宝します。ではその方法とは？ CSS（スタイルシート）に装飾スタイルや日本語フォントの変更コードを入れたい場合に、直接「Suffusion」のPHPファイルをいじることは可能です。しかしかなりの高頻度でテーマが更新されているので、毎回変更するのも面倒で、トラブルのもとになります。さらにやっかいなことにブログ記事の更新に支障をきたすほど時間が取られます。 しかしSuffusionには、恐ろしく簡単にCSSの変更ができ、しかもテーマを更新しても問題ないような機能があります。（Suffusion自体の各部CSS変更機能でスタイルが変更できない場合のみ。） スタイルのカスタマイズ方法 Suffusionの設定からメニュ
WordPress » スタイルシートを読み込む | MORILOG
<link rel="stylesheet" id="style-css" href="http://my-domain.com/style.css" type="text/css" media="all" /> WordPressでは、この<link>タグを自動生成してくれるwp_enqueue_style関数が用意されています。 テーマファイルでは<link>タグは直接書かずに、このwp_enqueue_style関数を使用します。 <?php wp_enqueue_style($handle, $src, $deps, $ver, $media); ?> $handle — スタイルシートのハンドル名 $src — スタイルシートのURL（オプション） $deps — 関連するスタイルシートのハンドル名（オプション） $ver — スタイルシートのバージョン（オプション） $medi
Suffusionの子テーマを作る – wizaman's blog
WordPressには色んなテーマがあるんですが、多すぎてお目当ての物を探すのには苦労します。そこらへんに転がってる野良テーマを使うとセキュリティ面で問題があるという話もあるし、公式に配布されているものを使うのが無難でしょう。タダだし、更新チェック効くし。そうして私が探した中で、唯一これだ！と思えたのが、現在使っている「Suffusion」です。 Suffusionはカスタマイズ項目が豊富なのですが、ほとんど手つけてないです。ヘッダの下にメニューバー追加したぐらいですかね。あとは直接コード書いてたりしてますが、それについてはあとで触れます。ともかく、ほとんどいじらなくていいぐらい完成度が高く気に入ってます。シンプルで見やすいのがいいんですよ。 WordPressは本体・テーマ・プラグインの最新版がないか自動でチェックしてくれます。Suffusionの開発は盛り上がってるみたいで、全然更新さ
WordPressの子テーマを作成する
2012年5月現在、Wordpressには「twentyeleven」というデフォルトテーマが入っていますが、オリジナルのテーマを作ろうと思ったら、このテーマの子テーマとして作ると便利です。 確かに「twentyeleven」のテーマは複雑すぎて、HTMLやCSS、テンプレートタグなどをある程度理解していないと難しく感じるのですが、function.phpにいろいろ追加しなくても、とりあえず「twentyeleven」が提供してくれる機能をフルサポートしながらデザインを変えられるという大きな利点があります。 子テーマ用のフォルダを作成 最低限必要なのはstyle.css その他のファイル イメージフォルダのパス スクリーンショット １．子テーマ用のフォルダを作成 まずは子テーマ用のフォルダを作成します。フォルダ名は任意の名前でＯＫです。 「wp-content/themes/子テーマのフォ
ページの先頭に戻るボタンを自作してみた
Scroll To Topを自作するメリット 実際にページの先頭に戻るボタン「Scroll To Top」を作成して思ったのですが、これは結構メリットがあります。 PCページとスマートフォンページでサイズや色を手軽に変更できる プラグインの更新でスタイルが初期状態になる事がない ボタンをクリックした時にURLの最後に「#top」がつかない これまでプラグインを利用している時にはプラグインの更新される度にプラグインのCSSを編集しなおしておりましたのでこの手間が省けます。それでPCページとスマートフォンページでボタンサイズを手軽に変更する事もできます。 そしてなによりボタンをクリックした時にURLの最後に「#top」がつかないのがメリットです。 プラグイン「Scroll To Top」を使っていて先頭に戻るボタンを押すとURLの最後に「#top」が付きます。 この状態でブックマーク等をすると
WordPress 子テーマで親テーマのスタイルシートを読み込む２つの方法
最近WordPressをよくいじっています。 WordPressには様々な公開されているテーマがあり、サイトの構成や外観を変更することができます。 しかしどんな優れたテーマでも個人の好みがあるので、カスタマイズは必要になってきます。 私はStinger5というテーマを継承し子テーマを作成し、カスタマイズを行っています。 その子テーマを作成する際に、親テーマのスタイルシート(style.css)の読み込みで少しはまったので、記録として残しておきます。 親テーマのstyle.cssを読み込む方法子テーマにおいて、親テーマのstyle.cssを読み込む方法は以下の2通りがあります。 子テーマのstyle.cssにおいて@importで読み込む方法子テーマのstyle.cssの先頭で親テーマのstyle.cssを@importで読み込む方法です。以前はこの方法が主流だったようで、ネットで検索すると
【サイト作成】WordPressテーマ「Suffusion」とプラグイン「AmazonJS」との不具合 | 天の古井戸
現在、当サイトはご覧のとおりWordpressを使って作成しており、「Suffusion」というテーマを使用している。 Suffusion » Aquoid Themes （作者サイト） しかし、先日のWordPressのアップデート（の直後、CSSがまったく反映されなくなるという事態に見舞われた。あせって対処法を検索しまくったところ、「プラグインどうしやテーマで使用しているjQueryが競合して動かなくなる」ケースが多々あるらしい。そこで確認したところ、まもなく、記事内のAmazon広告の表示に使用しているプラグイン「AmazonJS」が原因だと判明した。 AmazonJS « kwLog （作者サイト） WordPress › Amazon JS « WordPress Plugins （ダウンロードページ） [browser-shot url=”https://wordpress.o
美しいフォームデザインを実装する事が可能なjQueryプラグイン・Ideal Forms - かちびと.net
チェックボックスやラジオボタンなど、フォーム周り のデザインを美しくする事が出来るjQueryプラグ イン・Ideal Formsのご紹介。スタイルもいくつか 用意されており、フレームワークとして使えるよう です。デザインテーマもいくつか用意されている ので好みで選ぶことも出来ますね。 ボタン、セレクト、ラジオボタンやチェックボックス等のフォームデザインを変更できます。デザイの変更はcssのみで可能なフレームワークタイプなのでノンプログラマーな方でも気軽に使えそうですね。IE6以外は対応しているようです。 フォームのデザインをガラッと変えることが出来ます。よりデザインに統一感を出せそうですね。 テーマも用意されている Ideal Formsはフレームワークとしても利用出来るように、cssでデザインが変更できる作りになっています。現在は3つのcssファイルがテーマとして用意されていますのでそ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WordPressの子テーマを作る理由と子テーマを自作する方法 – ワードプレステーマTCD
WordPress Related Postsでブログが壊れた！他のプラグインと競合する | Wordpress備忘録
WordPressの子テーマで@importを使わないでCSSを読み込む方法 - ディレイマニア
http://webourgeon.com/2012/01/30/basics-of-the-child-theme/