サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
体力トレーニング
website-homepage.com
WordPressの構築では、公式テーマといえどしっかり構造化データに対応していないものも少なくありません。 ウェブマスターツールの構造化データをチェックすると大量にエラーが!!なんてことも。 SEOにどれだけ好影響を及ぼすのかはわかりませんが、最近はしっかり対応するように心がけています。 少なくとも構造化データでエラーが出ないようにはしておきたい所ですね! 今回改めて hentry(マークアップ: microformats.org)をイチから見直したので、フォーマット的なものを備忘録として残したいと思います。 (ご参考までに) そもそも構造化データって?ウェブマスターツールの 検索のデザイン > 構造化データ でエラーを確認してみましょう。 よくあるのはupdatedがありません authorがありません というやつですね。 ただ、最新のソースというわけではありませんので テストツールで
しばらく、FAQ表示にはFAQ managerというプラグインを利用していたのですが、更新がストップしていたこともあり、代替プラグインをさがしていました。 使い勝手の良さそうなプラグインがあったのでシェアします。 この記事公開時点では日本語の紹介記事は初かなと思います。 FAQにプラグインを導入するメリットというのは FAQの並び替えがドラッグで出来る FAQのカテゴリ分け表示が可能 ショートコードで簡単表示 デザインを変更できる といったものがあると思います。これらにマッチしたFAQプラグインをご紹介します。 Flexible FAQ のダウンロードプラグイン名Flexible FAQ 0.2プラグインサイト[browser-shot width=”600″ url=”https://wordpress.org/plugins/flexible-faq/”]プラグイン > 新規追加 >
MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 クライアントワークではadsenseの広告を貼る機会なんてほぼありませんが、自分で広告貼ろうとしたときに躓いた点をまとめます。 なぜかgoogle adsenseのレスポンシブ広告ユニットだけ表示されないという現象になってしまったためです。 テーマによってですが、 レスポンシブ広告ユニットが表示されない 普通の広告は表示されるのに・・・ コードのコピペミスはないのに・・・ という現象が起こると思います。 かなり久々の更新です。 はー、忙しかった。。 どんなに忙しくても月に一回は更新しようと思っていたのですが、忙殺されていました。 さてさて、 あれ、表示されない。。。 審
ホーム » WordPress » プラグイン » 問合せ系 » 確認画面やエラー画面、完了画面(サンクスページ)も遷移自由なフォームプラグインMW WP Form MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 問合せフォームの導入で良くあるのが『サンクスページを表示したい』という要望です。 メールアドレスの確認(一致)! 確認画面もページ遷移可能! 完了画面(サンクスページ)もページ遷移可能! 一番有名なプラグインはおそらくContact Form 7 だと思うのですが、MW form プラグインはこの辺の機能も管理画面から実装できるノンプログラマーには嬉しい作りでしたのでご紹介します。 20170501 MW
階層の深いWEBサイトはパンくずリスト・パンくずナビを表示すると回遊性・利便性が高まります。 Breadcrumb NavXTプラグインは構造化データ・リッチスニペットにも対応しているため、googleの検索結果にもパンくずリストを表示させることができます。 記事の階層が分かりやすい! サイトの回遊性が高まる! 検索結果にもパンくずを表示! Breadcrumb NavXTの投稿記事への導入と設定、CSSのカスタマイズについてまとめたいと思います。 Breadcrumb NavXT プラグインプラグイン名Breadcrumb NavXT 5.2.0配布元[browser-shot width=”600″ url=”https://wordpress.org/plugins/breadcrumb-navxt/”]プラグイン>新規追加>Breadcrumb NavXT の検索で候補にあがります
たまにはアクセス状況でも。 2014年11月までのアクセス状況です。 自分でできるSEO! を検証しようと始めたブログでもあります。 結果として、やっぱり継続して記事を配信していく!というのが大切ですね。 当ブログで利用しているSEO形のプラグインは HeadSpace2 SEO xml sitemap no caetgory base 等です。詳しくは Root-013 SEO系プラグインカテゴリの一覧をご覧下さい。 良く使われているのは All in one SEO pack だと思いますけど、HeadSpace2はカテゴリーごとのキーワード・ディスクリプションまで詳細に設定できるのでコチラを利用しています。 All in one SEO は別ブログでも利用しているのでその内記事にしましょうかね。 2014年2月~11月のアクセス 2月~11月のアクセスはこちら。未だ右肩上がり継続中で
google Adobe が共同開発したオープンソースフォント Noto sans font。 これまでWEBフォントはgenericonsやgoogle font位しか使ってませんでしたが、せっかくなので、挑戦してみました!! Notoをダウンロード Notoをサブセット化(圧縮)する サーバーにアップする fontデータを読み込む>表示 という流れです。 色々な記事を参考にさせて頂きました! 皆様ありがとうございます! 確認できる範囲では検証しましたが、これで果たしてOKなのだろうか!! 表示例ちなみに、コレですね。 テスト環境でやってましたがsafariがなんか汚かったので友人知人にも診てもらおうと思ってこちらの環境にも導入しました。 通常フォントfont-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic P
WordPressでファイルをダウンロードさせてカウントもしてくれるプラグイン Download Manager。 大変便利で、更新も頻繁に行われているプラグインです。 2014.11.22 ver2.7.1にアップグレードしたところ、旧バージョンで使用していた ダウンロードリンクが無効に! パッケージ自体が消えた! 他にも投稿内の文字が消えた! なんて影響がある人が居るかもしれません。 (言っちゃうとdownloadmanagerのCSSにcolorがimportant指定されているものがあるのです) 解決方法をまとめたのでシェアします! WordPress Download Manager 2.7.xのダウンロードプラグイン名WordPress Download Manager 2.7.xサイトリンク[browser-shot width=”600″ url=”https://word
ちょっとプラグイン紹介の前に、モーダルウィンドウについてモーダルウィンドウとポップアップの違いって?? ポップアップはポップアップでも、注意喚起を促すものや、ユーザーが適切な応答をしなければ操作できないようにするものを「モーダルウィンドウ」と呼ぶみたいです。 wikiより モーダルウィンドウ(英: Modal window)は、何らかのウィンドウの子ウィンドウとして生成され、ユーザーがそれに対して適切に応答しない限り、制御を親ウィンドウに戻さないユーザインタフェース設計になっているもの。モーダルウィンドウはGUIシステムで、ユーザーに注意を促したり、緊急の状態を知らせる目的でよく使われる。 プラグイン>新規追加>『ITRO Popup Plugin』検索で出てきます。 詳細設定は、設定>ITRO Popup で設定画面になります。 配布元:ITRO Popup Plugin(ver4.6.
前回紹介した画像をアニメーションさせられるスライダー機能内蔵のwordpressテーマ『SunRain』のカスタマイズについての記事です。 このテーマのスライダーにはjQuery の FractionSlider が使用されています。 FractionSliderについて理解を深めると、スライダーのカスタマイズもスムーズに行きますよ! 画像を個々に動かしたい! トランジション等、動きをつけたい! スライダを派手に!FLASHみたいに! FractionSlider自体も使ったことはありませんでしたが、色々な動きが出せるみたいで面白いですね。 FractionSliderについて紹介記事は下記です。 コリスさん http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-fractionslider
ホーム » WordPress » プラグイン » SEO対策系 » 私はコレ(headspace2)で、重複コンテンツを解消しました。headspace2とワードプレス設定のお話。 MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 2017年7月 追記 Headspaceがアップデートをしなくなって数年経ちます。All in One SEO Packはメジャーですが、さらに細かな設定ができる多機能SEOプラグインの紹介記事を書きました。 HeadSpace2 からのインポートにも対応していますが、作業の際は慎重に行うようにしましょう。注意点についても記載しています。 高機能・多機能のWordPress プラグイン Y
「サイト全体を一時的に非公開にしたい」 「公開前だからサイトを見せたくない」 「デザインリニューアルや機能追加の為に、テスト中は一般ユーザーが閲覧できないようにしたい」 そんな時に便利なプラグインの紹介です。 「工事中」「準備中」「メンテナンス中」呼び方(用途)は様々ですが、要はページ全体を一気に非公開にできます。もちろんログインをすれば通常の表示を確認できます。 ※新バージョン2.0.2で仕様が結構変わりました。 詳しくはWP Maintenance Modeが刷新されましたね。をご覧下さい。 シンプルなEasy Pie Maintenance Modeも紹介しています。 WP Maintenance Modeのダウンロードプラグイン名WP Maintenance Modeサイトリンク[browser-shot width=”600″ url=”http://wordpress.org/
ホーム » WordPress » プラグイン » SEO対策系 » 検索エンジン用のサイトマップを生成する「Google XML Sitemaps」でSEO対策! MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 2014.10.27 こちらのGoogle XML Sitemaps と Headspace2 SEO で重複コンテンツを解消する方法を記事にまとめました! 詳しくはコチラ >headspace2とワードプレス設定で重複コンテンツを解消したお話。 2017年7月 追記 Headspaceがアップデートをしなくなって数年経ちます。All in One SEO Packはメジャーですが、さらに細かな設定ができる
以前ご紹介したWP Maintenance Modeが2.02になり、機能面が刷新されたようですね。 主に追加されたのは ・購読申込み ・ソーシャルアイコン ・問合せメール受付 逆に以前あったメタ情報(ログイン等)の表示機能は無くなったようです。 ・・・しかし・・・検証環境では問合せ系機能やカウントダウン機能が上手く動きませんでした。記事作成時(2014.9.18)wordpress最新バージョンでのテストは行われていないようなので今後に期待です。 カウントダウン機能はありませんが、シンプルなメンテナンスモードを実装できるプラグインも一緒に紹介したいと思います。 WP Maintenance Modeのダウンロードプラグイン名WP Maintenance Mode 2.0.2サイトリンク[browser-shot width=”600″ url=”https://wordpress.org
WEBデザインはPhotoshopをメインで使っていましたが、一人で仕事するようになっていつのまにかIllustratorメインになっていました。 イラレって、 ・座標が小数点になってイラッ ・オブジェクトの大きさが小数点になってムカッ という印象しか無かったんですが、 ちゃんと設定とか気をつけて使うようになると、 あれ、 ・スポイトとか超便利 ・レイヤー操作とかフォトショより感覚的で良い感じ ・リンクファイル便利。スライスとかも、使い方によっちゃイラレの方が便利なんじゃ・・・ ってなりました。 イラレでWEBデザイン始める時に気をつけること。photoshopにも言えることですが、新規ファイルのカラーモードだけはWEB用にしましょう。 後から変更はできますが、色味が変わっちゃいます。 新規ドキュメントプロファイルを「WEB」にすれば、単位がピクセル・カラーモードはRGBになってくれます。
リンクの設定は投稿画面から簡単にできるとはいえ、更新者がHTMLに全く縁の無い人だと手間に感じてしまうでしょうね。 1.投稿画面でURLを貼り付けるだけで公開と同時にaタグで囲ってくれるプラグイン 2.リンクが外部サイトかどうかを認識して外部サイトなら別ウィンドウで開くようにしてくれるプラグイン があったのでご紹介します。 これで・・・ リンクさせたいテキストを選択してですね~~このアイコン押してですね~~ここにリンク先のURLをコピペするんですよ~~~んでもし別ウィンドウで開きたかったら「リンクを新ウィンドウまたはタブで開く」にチェックを入れてですね~~~最後にリンク追加っていうボタンを押してください。 という説明が不要になります。(笑 URLの自動リンクプラグインAutolink URIプラグインAutolink URIサイトリンク:[browser-shot width=”600″
ホーム » WordPress » カスタマイズ » シンプル!レスポンシブ!ピンタレスト風~!!なWordPressテーマ「Surfarama」其ノ弐 MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 いやいや~。 前回ピンタレスト風テーマSurfaramaを紹介し、軽~い気持ちで使ってみようと思ったんですが、こやつ、中々の曲者!! いや、色々欲を出して無限スクロール infinitscrollや画像遅延ロードlazy load を入れたいなんて言ったからなんですけどね。 軽い気持ちで発言してすんません!すんません!! 結論から申し上げると、infinitscroll も lazy load もプラグインでは上手く動
画像をいっぱい投稿するから綺麗に見せたい! もちろんレスポンシブで! あとディスプレイサイズが変わる時に画像をレンガ状に並び替えてくれるアニメーションもなんかカッコイイからつけてね! という要望に応えられるテーマを探してみました。 これからカスタマイズしていくので、まずは第一回ということになります! 第二回「infinite scroll 導入編」はコチラ 2014.09.14ちょっとした変更で読み込み速度を改善しました。surfarama其ノ参。サムネイルの読み込みについて。 コンテンツをレンガ状・パネル状に並べてくれるサイトはよくありますが、画像投稿をメインにしたいサイトで取り入れると視覚的にも楽しいですね。 知っているかぎりではjQueryのMasonryが使われています。 surfaramaというテーマ。テーマタンク様で紹介されていたテーマを使おうと思います。 テーマタンクさんは色
ホーム » WEBデザイン » 小ワザ » 「パソコンでコピペするときの便利な方法」というのが巷で話題みたいなので、便乗して補足しとこう。(当方OS windows) MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 「パソコンでコピペするときの便利な方法」というのがスゴイ拡散されてますね。 確かにとっても便利なんですが、最終的な操作がマウスクリックなので半角英数がターゲットだとちょっと物足りないです。 そこで、便乗(ぐへへ)して補足記事書いてみました。 マウス操作にも触れていますが、基本的な範囲選択はキーボードだけで簡潔できます。 慣れれば便利ですよ。 ※当方OSがWindowsです。 ※ブラウザで試す場合は、一文字
MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 静的ページにwordpressを組み込みました。 要は、『wordpress入れてフルリニューアルじゃないけど、ブログだけCMS入れたいんだよね~』 という要望です。目的はSEOですけどね。 やはり、今後のSEOはインデックス数を増やしていかないとですもんね。 静的ページのみのページは更新の手間が掛かるため、クライアント側で記事を追加していくのが大変です。 ページの中身だけを更新していくよりも、オリジナリティのあるブログをどんどん追加していく方がSEOには有利でしょうね。 さて、そのままではHTMLファイルにWordPressの記事一覧を表示することはできませんが、ht
クライアントからイラレのデータをもらっていざデータを編集しようとすると・・・・ フォントがシステム上にありません。 見つからないフォントは代替されました。 となることはありますよね。 データの前任者がこちらに無いフォントを使っていたり、OSが違ったりするとこのようになり、代替フォントを使用すると見た目が違ってしまいます。 案件にもよりますが、メニューや見出しであれば代替フォントで似たものを探せばそれでも良いかもしれません。 しかし、ロゴマークに使われているロゴタイプだったりするとそうもいきませんよね。 普通にイラレのデータを開くと自動的に代替フォントに変わってしまいますが、これを無理矢理アウトラインで開く方法を紹介しようと思います。 ※環境はOSが Windows7 バージョンはCS5です。 まず、もらったデータを普通に開いてみます。 フォントデータが見つからないと、画像のように 「フォン
コーポレートサイトを作る時には、やっぱり新着情報を表示したいという要望が多いですよね。 「カスタムフィールドの値を表示したい」なんて特殊な要望の場合はphpで書いた方が早いですが、 ・記事タイトル ・日時 ・抜粋文 ・サムネイル画像 といった基本的な表示なら、プラグインのショートコード(+CSSの編集)で完結できることも多いです。 今回はそんな機能をもったプラグインを3つ紹介したいと思います。 追記201809 サムネイルを含めたグリッドデザインが導入しやすく、設定が豊富で拡張性の高い新着情報表示プラグインを見つけたのでこちらでご紹介しています。 WordPressの新着情報(記事一覧)表示プラグイン「Post Grid」はグリッド幅の調整やMasonry、表示項目やスタイルのカスタマイズも可能!検索機能やページングもあり! 3つのプラグイン1.プラグイン名What’s New Gener
2015.05.21 こちらのFAQ Managerプラグインの更新が止まっているので代替プラグインを紹介します! Flexible FAQ について CSSの追加方法について、記事を更新しました! >>「FAQ manager」のデザインをCSSでカスタマイズ! WordPressでFAQ、Q&A、「よくある質問」などを管理するならオススメのプラグインがあります。 カスタム投稿形式で増やしていけるので、自分での更新はもちろん、クライアントにも嬉しい作りですね。 さらに、カテゴリやタグで分けることができ、それぞれをショートコードで個別に表示できるので大変便利! jQueryを利用した折りたたみ(アコーディオン)の効果もデフォルトで備えています。 導入事例はこちら!CSSを追加すれば、このようなデザインにすることも可能です。 FAQ Managerのインストールプラグイン名FAQ Manag
ホーム » WordPress » プラグイン » 投稿便利系 » 資料やファイルをダウンロードさせて、ダウンロード数の統計を取りたい・・・といったクライアントのご要望に応えられるプラグイン!Download Manager MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 2014.11.22 ver.2.7.x位から機能・仕様が刷新されました。下記は2.5から2.7以前迄のバージョンを元に書いた記事ですが、特別な理由等で旧バージョンをご利用の方の為に残しておきます。 そのため、キャプチャやシュートコードに関しては最新バージョン2.7.xとは違うようですのでご注意下さい。 等ブログで起こった不具合や解決方法、2.7.
ほとんどのサイトが取り入れているスムーススクロール。 実装するプラグインも沢山ありますが、今回紹介するプラグインは、なんとデザインの変更まで管理画面で出来ちゃいます! 新規にCSSを追加したり、画像を置き換えたりしなくても大丈夫! とっても便利なプラグインです。 プレビューを見ながら、サイトに合ったテイストのボタンに変更できます! Dynamic “To Top” Pluginのインストールプラグイン名Dynamic “To Top” Pluginプラグインサイト[browser-shot width=”600″ url=”http://wordpress.org/plugins/dynamic-to-top/”]プラグイン>新規追加>Dynamic To Top 等で検索 有効化しましょう。 外観>To Top が追加されていますので、こちらからデザイン変更が可能です。 デフォルトでも、
ホーム » WordPress » プラグイン » アクセスアップ系 » 画像を拡大表示!でかすぎても大丈夫!jQueryを使ったlightbox風プラグインWP jQuery Lightbox MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 もはや画像の拡大表示には外せない機能です。lightbox。 プラグインはたくさんありますが、今回紹介するプラグインの特徴は ・jQueryを使用している つまり、他のJavascriptライブラリのものと併用すると、競合の問題が起きてしまう所を、こちらのプラグインを使えば未然に防ぐことができます。 ・ウィンドウのサイズを検知して拡大をストップしてくれる デジカメの性能はどんど
MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。 WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。 でご紹介したプラグインのカスタマイズです!! こちら、ページ遷移が別ウィンドウで開きません。こちらを target="_blank"にしましょう! カスタマイズと言っていいのかどうかも怪しいラインですが(笑 プラグイン>プラグイン編集>Browser Shots でプラグインのコードに少しだけ変更を加えます。 if ( !empty( $image_uri ) ) { $image = '<img src="' . $image_uri . '" alt="' . $alt . '" width="' . $width . '" class="alignnone" />
このページを最初にブックマークしてみませんか?
『WEBデザイン・HP制作 / WordPress構築・SEO対策まで総合的に対応可能です。 | Root...』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く