サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
www.d-31n.com
本日もJetpackネタです。今日は共有ボタンのカスタマイズを詳しく説明します。 共有ボタンを設置 Jetpackの共有ボタン 設定ページへ行き、利用可能なサービスから有効化済みのサービスへアイコンをドラッグして移動させます。 ボタンを表示したい箇所にチェックを入れ、変更を保存をクリックして完了です。 表示箇所はコンテンツの下部に自動表示されます。 共有ボタンを新しく作る デフォルトで設定されているアイコンは日本のSNSサービスは入ってません。 ですが、Jetpackは簡単にボタンを追加することが出来ます。 新しいボタンの登録設定 共有ボタン設定画面の利用可能なサービスの下にある「新サービスを追加」をクリックします するとサービス名 共有URL 画像URLと3つの入力フォームがあります。 サービス名は任意ですので、適当にSNSボタンの名前を(そのままボタンに表示されるテキストになりま
よくニュースサイトなんかで 一つの記事が分割されているのを見ますね。 wordpressにもその機能がついています。 ついていると言ってもTwentytenとかなら問題ないのでしょうが、使用しているテーマが それに対応していないとダメなのでその場合の対応処置を説明します。 Let’s Study WordPress! ←乗りよく 分割させたい所に入れるタグ wordpressにはmoreタグと同じようにページ分割用のタグがあります。 分割させたいところで下記のタグを入れてあげます。AddQuicktag等で登録しておけば楽チンですね。 <!--nextpage--> テンプレートに対応させる single.phpの中に下の記述がありますので、その下あたりを見てみましょう。 <!--?php the_content(); ?--> 下記のタグがなければこれをコピペして入れてみましょう。
WordPressをより便利にカスタマイズしたい場合、functions.phpへの記述は避けて通れない作業です。 しかし、functions.phpは他のテンプレート(header.php等)に比べると、とてもデリケートで、ちょっとしたミスがダッシュボードへログインできなくなったり、サイトが閲覧できなくなってしまいますので、注意が必要です。 Functions.phpとは、簡単に説明するとWordPressに新しい機能やルールを付加する為に記述をまとめるテンプレートとなります。それらを簡単に導入できるのがプラグインだったりもします。 functions.phpの記述ミスで引きおこる可能性があるエラー サイトが真っ白になる(サーバーによってPHPのエラーが表示されない為) サイトにエラーコードが表示されるだけ ダッシュボードにログインできない functions.phpで記述したテキストが
今日クライアントと話をしていて教えて頂いたのですが、WordPressのバージョン3.5からリンク機能がなくなったというのです。 古いバージョンからアップデートした場合は機能が残るようですが、新たに最新のWPをインストールすると無いのです。 確かにリンクは海外の無料テーマ等で最初から意味ないリンクが貼られていたり、パンダにより外部リンクがSEO的に意味がなくなったり、SNSの普及により、重要視されなくなったのかもしれませんね。 ブログテーマより企業サイトの制作が多い私には、まさに寝耳に水でした:) ではリンク集が必要な人はどうすれば? いくつか方法を説明します。 カスタムメニューで作る ウィジェットが使用可能なテーマならば、外観メニューから外部リンク専用のカスタムメニューを作り、ウィジェットに表示させる方法があります。 新しいメニューを作る
wordpressのお問合せフォームプラグイン「contactform7」のカスタマイズです。 今回は記事ページもしくわ固定ページに問合せフォームを設置し、尚且つフォームの件名に記事タイトルを設定する方法です。 商品を販売等のページの下に問合せフォームを付けたりする時に役立つカスタマイズ方法だと思います。 記事ページ・固定ページの任意の場所に問合せフォームを設置する 通常お問合せページ等を作り、投稿欄にContactform7のショートカットコードを入力するだけで完了ですが、 single.phpやpage.phpにこのショートカットコードをそのまま入れても動作しません。 ですので、下記タグをテンプレートのお問合せフォームを表示させたい箇所に入れます。 contact-formのショートコード[の間に記述されている部分]は変更してください。
外部サイトへのリンクは、新しいウィンドウ(target=”_blank”)で開くほうが離脱率等を考えると良いですね。 それ以外にコメントに入力された外部リンクからユーザーが戻ってこなくなる場合もあるでしょう。 target=”_blan”のタグは非推奨とかそうでもないとか議論が分かれますが、多少のマイナスだったとしても、外部リンクは別ウィンドウで開くメリットは色々あると思います。 ちなみにタイトルで一行の記述で~~とありますが、実際は一行でないのでご了承ください。 やりかたは下記の記述をhead内に入れるだけです。jqueryを使用しますので、jqueryを使用していないサイトは、別途jqueryを呼び出すタグを入れてください。 これで、記事中やコメント内の外部リンクが全て新しいウィンドウで開かれるようになります。 <script type="text/javascript"> $(
固定ページを作り、そのページの内容をトップページに表示させたい。 CMSサイトとして制作する場合にも こういう事もあるかと思います。 やり方は簡単。まずは固定ページを作りページIDをゲットしましょう。 次に、該当ページを表示させたい場所(index.php等)に下記のタグを入れます。 <?php $page_id = ここにページID; $mes = get_page($page_id); echo $mes--->post_content; ?> タイトルも取得したい場合は <?php $page_id = ここにページID; $content = get_page($page_id); echo “<h2>” . $content->post_title . “</h2>n”; $content = get_page($page_id); echo $content->post_co
フリーのブログテーマなんぞを使う時に テーマオプションが設定出来ると 少し得した気分になります。 有名所ではカスタムヘッダーと背景でしょうか。 今回は、それに加えて様々なオプションを手軽に付けられる方法を紹介します。 ヘッダー画像をテーマオプションで変更できるようにする 下記のコードをfunctions.phpに加えます。 // カスタムヘッダー define('HEADER_TEXTCOLOR', 'ffffff');// 画像の上ににテキストを乗せる時の色指定 define('HEADER_IMAGE', '%s/images/default_header.png');//デフォルトで表示させる画像ファイル define('HEADER_IMAGE_WIDTH', 1000);// 画像の幅サイズを指定します define('HEADER_IMAGE_HEIGHT', 287);//
wordpressで書いた記事は、アーカイブ(記事一覧)では新しい順(降順)に並びます。 でも 中には小説を書いて古い順に並べたいとか、マニュアルを1から順番でとかという場合もあるでしょう。 wordpressには「query_posts」という条件を指定できるタグがあります。 これをループの前に付け加えることで、いろいろな条件の指定ができます。 query_postsで出来る指定はいろいろありますが、他の使い方は機会があればまとめます。 今回は、この昇降順の変更と、特定のカテゴリーのみに指定する条件分岐についてです。 古い順に並べてみる アーカイブ:arcive.phpというファイルが記事一覧のテンプレートになります。 これが無い場合はindex.phpを見てください。wordpressのTwenty ten~のテーマではloopの中をいじらなくてはならないので、慣れていない人は
記事の上や下にいいねボタン等が並んでるのをよく見ますね。 WP Social Bookmarking Lightは世界で一般的なSNSサービス以外にも日本のソーシャルブックマークボタンを手軽に表示できる プラグインです。 プラグインのインストール プラグイン新規追加よりWP Social Bookmarking Lightを検索して有効化。 有効化したら設定からWP Social Bookmarking Lightに入り表示させたいボタンの設定を行います。 プラグインのサイト→ プラグインの設定 ダッシュボード設定の中にWP Social Bookmarking Lightというメニューがあるのでクリックします。 左が表示させるSNSボタンになります。右から左へ好みのSNSボタンをドラッグ&ドロップします。 ここで設定できる項目 ◆ 位置: 記事内のどこに表示するか(記事の上・記
WordPressでECサイトを構築出来るプラグインWelcartはフリーでありながら良く出来た素晴らしいプラグインです。 Welcartのテーマを使用する場合、もしくわ自作でテーマを作る場合に商品リストを表示させる方法です。 丁度いまWelcartを使用したサイトを作っているので、気づいた点を記事にしていきます。 Welcartのテーマならばトップページは商品サムネネイル付でリスト表示(デフォルトではお勧め商品)するようになっていますが、 カテゴリー一覧では通常のアーカイブテンプレートが使われる為、ブログと同じような表示になります。 トップページに商品リストを表示させる トップページで商品一覧を表示させたい場合は、下記のような記述になります(Welcartテーマのindex.php参考) これはカテゴリースタッグがitemreco(お勧めカテゴリー)の商品を8個表示させるという記述
WordPressの検索をサクッとカスタマイズする方法を紹介します。 カテゴリー別に検索させたい時のカスタマイズ方法です。 WordPressの検索フォームは基本的に、or検索です。and検索にする方法は別の機会に紹介します。 基本的な検索フォームの設置 使用しているテーマによっては、searchform.phpというテンプレートがあるので、それを呼び出すか、ウィジェット等で設定します。 任意の場所に検索フォームを設置したいような場合は、例として下記のようにタグを記述します。 通常の検索フォームの設置 <form method="get" id="searchform" action="<?php bloginfo('url'); ?>/"> <input type="text" onfocus="if (this.value == 'キーワードから検索') this.value =
wordpressの問い合わせフォームを作るのに便利なContactform7 他にも問合せフォームを作るプラグインはあるけれど、やっぱり私はこれに頼らざるえない。 だが他の問合せフォームで見るような2点の機能が無い。それは・・ ■ 確認用にメールアドレスを2回入力させ、尚且つチェックする機能 ■ 郵便番号を入力すると自動で住所が入力される機能 というわけで 上記の2点をContactform7に対応させてみました。 確認用にメールアドレスを2回入力させ、尚且つチェックする機能 こちらはとても簡単に実装出来ます。Contactform7は透かし文字も入れられるので、下の画像のようにテキストエリアに文字を入れられます。 1:まずfunction.phpに下記の記述を追加します。 /* custom contactform7 */ add_filter( 'wpcf7_validate_ema
特定のカテゴリー以下の記事だけ他のsingle.phpを使いたい。出来るんですねこれ。 やり方は簡単なのですが この設定だとカテゴリーの子カテゴリー以下の記事には指定されません。 記事に対する親カテゴリーで指定しましょう。 function.phpに記述する add_filter('single_template', create_function('$t', 'foreach( (array) get_the_category() as $cat ) { if ( file_exists(TEMPLATEPATH . "/single-{$cat->term_id}.php") ) return TEMPLATEPATH . "/single-{$cat->term_id}.php"; } return $t;' )); single-カテゴリー名.phpを作る function.ph
聞きなれないGROWというSNSサービスの名称を耳にしたので早速ググッてみた。 これはTwitterのツイートボタンやFBのイイネボタンと同じようにブログ等に付けられるボタンなのだ。 ユーザーがこれをクリックすることで、そのブログサイトにチャリンと寄付が出来るというもの。 これは とてもいいサービスだと思う。 日頃 分からない事をググって訪れた先のブログ記事に何度救われた事か。。 これがあればチャリンと寄付もしたくなるというもの。 wordpressへの設置はプラグインが便利 まずは GROWへ行ってアカウントを取得しよう。 Growオフシャルサイトはこちら→ TwitterやFacebookのアカウントでもログイン出来るので楽チン。 ちなみに寄付をするにはGrowポイントの購入が必要になる。Paypal対応なので簡単。 1ドルで100ポイントなので Growワンクリックあたりで寄付できる
wordpressの魅力はなんといっても豊富なプラグインが無料で使える事。 導入も設置も大抵はWEB知識が無い方でも簡単にできます。 でもでもブログテーマ等 複数のユーザーが手軽に使えるようなテーマを作る場合、 プラグインに頼らずにデフォルトでテンプレートに組み込んでおきたい機能が幾つかあります。 今回は、パンくずナビゲーションとページナビゲーションを設置する方法を紹介します。 ぱんくずナビゲーションをプラグインを使わずに設置 まずはfunctions.phpに下記のコードを入れます // パンくずナビゲーション function get_breadcrumbs(){ global $wp_query; if ( !is_home() ){ // Start the UL echo '<ul>'; // Add the Home link echo '<li><a href="'. get
wordpressのお問合せフォームプラグイン「contactform7」のカスタマイズです。 今回は記事ページもしくわ固定ページに問合せフォームを設置し、尚且つフォームの件名に記事タイトルを設定する方法です。 商品を販売等のページの下に問合せフォームを付けたりする時に役立つカスタマイズ方法だと思います。 既にコンタクトフォームの設置・設定は完了している状態からの説明です。 インストールから設置までの説明はこちら→ 記事ページ・固定ページの任意の場所に問合せフォームを設置する 通常お問合せページ等を作り、投稿欄にContactform7のショートカットコード([contact-form 1 “コンタクトフォーム 1″]等)を入力するだけで完了ですが、 single.phpやpage.phpにこのショートカットコードをそのまま入れても動作しません。 ですので、下記タグをテンプレートの
wordpressで企業(CMS)サイトを作る場合、サイト構成が複雑になってくると、特定のページのみ使用したいテンプレート等出て来ます。 やり方はいろいろあります。 簡単なのは、そのページのID番号でファイルを作る方法。 page-id(番号).php というファイルをテーマフォルダの中にアップすれば、 そのページIDのみテンプレートが反映されます。 ですが 別のテンプレートを作って、サイトの中の複数のページにそのテンプレートを割り当てたい時は まずテンプレートを作ってテーマフォルダの中にアップします。 例えば infomation-php等 そして そのテンプレートの頭に下記タグを入れてやります。 <?php /* Template Name: infomation */ ?> infomationの部分が新たに作ったテンプレートのファイル名になります。 するとページ作成の画面、右側
下層ページのみヘッダー画像をページ毎に簡単に変更するという カスタマイズをしたのだが、絶対に忘れてしまうので 備忘録として記しておこう。 wordpressの新しい機能として カスタムヘッダーとアイキャッチ画像の登録というのがある。 簡単に説明すると カスタムヘッダーはテーマの編集でヘッダー画像を変更出来る仕組み アイキャッチ画像とはその記事を代表するサムネイル等に使用する画像を指定するもの というわけで、通常はカスタムヘッダーで登録した画像をヘッダーに表示し、アイキャッチ画像を設定したページや記事には アイキャッチ画像がヘッダー画像として設定されるというカスタマイズをしてみました。 まずfunction.phpにカスタムヘッダーの設定をする。 詳しい説明は省きます。 add_custom_image_header('header_style','admin_header_style');
久しぶりにサイトのリニューアルをしたので 今まで適当だったブログ部分に色々手を加えてみました。 今回紹介するのは記事一覧ページで、記事のサムネイル表示、それと抜粋記事を設定していない場合もしくわ設定しているが表示文字数を変えたい時の方法です。 記事サムネイルを表示させるプラグイン 記事のサムネイルを表示させるには、wordpressのアイキャッチ機能などを使っても出来ますが、過去に投稿した記事のことなどを考えるとアイキャッチは面倒。 というわけでプラグインを導入しました。 プラグイン名:Thumbnail For Excerpts 1:上記サイトからダウンロードしてアップするか ダッシュボードのプラグイン追加から検索してインストール。 2:有効化してThumbnail For Excerptsの設定画面へ。(下画像) 画像サイズ設定:widthとheightは表示するサムネイルのサイズで
wordpressの問い合わせフォームを作るのに便利なContactform7 他にも問合せフォームを作るプラグインはあるけれど、やっぱり私はこれに頼らざるえない。 だが他の問合せフォームで見るような2点の機能が無い。それは・・ ■ 確認用にメールアドレスを2回入力させ、尚且つチェックする機能 ■ 郵便番号を入力すると自動で住所が入力される機能 というわけで 上記の2点をContactform7に対応させてみました。 確認用にメールアドレスを2回入力させ、尚且つチェックする機能 こちらはとても簡単に実装出来ます。Contactform7は透かし文字も入れられるので、下の画像のようにテキストエリアに文字を入れられます。 1:まずfunction.phpに下記の記述を追加します。 かならずの間に入れてください。 add_filter( 'wpcf7_validate_email', 'wpcf
アクセス解析を見ていたら ページ属性というキーワードで検索されていたので きっと この事だろうと思い紹介します。 各ページやカテゴリーに属性を持たせる方法です。 (例:body id=home等) これは<body>の部分に入れます。大抵のテーマの場合はheader.php内に<body>というタグがあるので そこを変更します。 <body>タグを削除して下記のタグを入れます。 <?php if ( is_home() ): ?> <body id="home" class="home"> <?php elseif( is_page() ): ?> <?php $parent_slug = get_page_uri($post->post_parent); ?> <body id="<?php echo $parent_slug ;?>" class="<?php echo $pa
ブログ wordpressプラグイン wordpress: ソーシャルブックマークプラグイン「WP Social Bookmarking Light」を好きな位置に配置する方法 ソーシャルブックマークのプラグインは色々ありますが これが一番かと思っています。 大抵の物は全て揃ってますし Mixiチェック(Mixiへの設定が面倒だけど)も付けることが出来ます。 このプラグインを使用した場合、設定から位置を変更(記事の上か記事の下)出来るのですが 微妙に ここじゃないんだよな・・って事が出てくるので 任意の場所に配置出来る方法を紹介します。 WP Social Bookmarking Light プラグインのインストールはプラグインメニュー新規追加から検索するか こちらのサイトからDLしてください。 インストールし有効化したら設定から 好きなソーシャルブックマークを選択して保存します。 これ
基本的に私の仕事の進め方としては、クライアントの意向を聞いて いきなりphotoshopで作り始めます。 でもでも 複雑なテンプレートを要する場合はワイヤーフレームを作って事前に説明することもあります。 今回は そんなワイヤーフレームやサイトマップ等を簡単に作れる無料のサイト(有料版もあり)を紹介します。 ここで作るワイヤーフレームは本格的な物が作れますが、基本的には打合せ等で使う一つのツールと考えた方が良いですね。 そのかわり 複数の人間で共有したり クライアントと電話などで画面を見ながらやりとり出来るという利点もあります。 もちろん大抵はPDFやPNGで保存出来ますので メールで送ったり印刷したりもOK。 あと大体どこも自動保存なので PCが固まったりしても大丈夫です。 cacoo 日本語サービスにも対応した有名なサイトです。 アカウントを作成すれば とりあえず無料で作れます。
ワードプレス(wordpress)を使ったCMSWEBサイトデザイン製作・リニューアル・テーマカスタマイズやテーマの制作、更新も手軽に出来るCMSビジネスサイトはお任せください。ロゴデザイン様々なプランを用意しております。渋谷区恵比寿
wordpress Contactform7をカスタマイズ wordpressの問い合わせフォームを作るのに便利なContactform7 他にも問合せフォームを作るプラグインはあるけれど、やっぱり私はこれに頼らざるえない。 だが他の問合せフォームで見るような2点の機能が無い。それは・・ ■ 確認用にメールアドレスを2回入力させ、尚且つチェックする機能 ■ 郵便番号を入力すると自動で住所が入力される機能 というわけで 上記の2点をContactform7に対応させてみました。 確認用にメールアドレスを2回入力させ、尚且つチェックする機能 こちらはとても簡単に実装出来ます。Contactform7は透かし文字も入れられるので、下の画像のようにテキストエリアに文字を入れられます。 1:まずfunction.phpに下記の記述を追加します。 [php] /* custom contactform
WEBサイトは生き物です。どなたでも簡単に更新が出来、多くの人の目に触れて頂けるような生きたWEBサイトを提案致します。
ブログ以外のページをトップページに設定したり wordpressをCMSとして使用する場合には 更新情報やニュースが必要になってきます。 あとはcssでスタイルを変えるか 直接テーブルとかでスタイル調整してもいいです。 参考までにこのブログのトップに入れてあります。 下記のソースを参考にindexphpかhome.phpに記述します。 <h2>What's New</h2> <?php query_posts($query_string . 'showposts=5&cat=0'); ?> <?php if (have_posts()) : ?> <dl> <?php while (have_posts()) : the_post(); ?> <dt><?php the_time('Y-m-d') ?></dt> <dd>[ <?php the_category(', ') ?> ] <
このページを最初にブックマークしてみませんか?
『WordPressでホームページ制作|渋谷区恵比寿 株式会社インタービー デザイン制作事...』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く