ブログを始めたりホームページを自作したりするために勉強しはじめると、さらにデザインを凝ったものにしたくなります。 また、ある程度カスタマイズが進めば、表示速度をもっと早くしたり、より短いコードでコーディングしたりしたくなります。 そこで必ず話題に上るのが、CSSです。 もちろん、LessやSassのようなCSSプリプロセッサー(関数を使ったりしてプログラミングコードのように書くことができるCSS)が誕生したことで、より複雑なデザインをできるだけ少ないコードで書くことができるようになりました。 しかし、フロントエンドエンジニアとしてレベルアップするためには、どのように書けばレイアウトが改善されたり表示速度が速くなるのかをしっかりと理解しておいたほうがよいでしょう。 今回は、Webデザイン初心者がランクアップするためのCSSのコツをご紹介します。 これから紹介する、多くの初心者を泣かせたCSS

WordPressでカスタムフィールドを検索対象に含める方法を紹介します。 カスタムフィールドに入力した値を検索することができるようになります。 実装は簡単です。下記のコードをfunctions.phpに追加します。 /** * 参考 http://wpcj.net/1363 */ function posts_search_custom_fields( $orig_search, $query ) { if ( $query->is_search() && $query->is_main_query() && ! is_admin() ) { // 4.4のWP_Query::parse_search()の処理を流用。(検索語の分割処理などはすでにquery_vars上にセット済のため省く) global $wpdb; $q = $query->query_vars; $n = ! em

lifemake.design 2024 著作権. 不許複製 プライバシーポリシー

2014/01/27 タグ: テーマ, テンプレート, 中級 SEOでは欠かせないmetaタグのnoindex。 WordPressでは通常の静的HTMLサイトと違いテンプレートから一律にヘッダ情報が読み込まれることから、ページごとにnoindexを付けるのは面倒です。 「All in One SEO Pack」や「WordPress SEO by Yoast」などのプラグインでも可能ですが、これらを使わずより柔軟、かつ記事投稿時に手間をかけないようnoindexタグを任意のページで出力させる方法を紹介します。 IF文を使った条件分岐で必要なページにmetaタグを出力 ヘッダテンプレートであるheader.phpに加えることで任意にnoindexタグを生成します。 条件を指定すればいろんなページに自動出力できますので、いくつかパターンを用意しておきます。 なお、今回はnofollow属性は

WordPress の個別投稿ページや固定ページにおいて、SEO の面で状況により検索エンジンのロボットに対象のページをインデックスして欲しくない場合や、リンクを辿って欲しくない場合があります。これらの制御は meta タグを利用して、noindex や nofollow を設定することで、実現することができます。 <!--noindex だけ定義--> <meta name='robots' content='noindex,follow' /> <!--noindex と nofollow を定義--> <meta name='robots' content='noindex,nofollow' /> 既存の標準機能だけで実現できるかWordPress の標準機能では、サイト全体を Google や Yahoo などの検索エンジンにインデックスさせない設定を行うことはできます。ダッシュ

先日の記事「フォントサイズの指定方法（翻訳版）」で、CSSの比較的新しい単位「ビューポートの単位(Viewport Units)」について触れました。この単位「vw, vh, vmin, vmax」はブラウザのビューポートのサイズに基づくもので、これらの単位で指定した実際の大きさはビューポートの大きさによって変化するため、レスポンシブデザインにあった単位と言えるでしょう。 これらの単位を使うことは「フォントサイズの指定方法」でフォントサイズに使うことを反対しましたが、レイアウトでは非常に役立つ単位です。 Viewport vs. Percentage Units 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 ビューポートの単位(Viewport Units)とは 要素を幅いっぱいに指定 (% > vw) 要素を高さいっぱいに指定 (

Googleが常時SSL化を推奨していることもあり、WEBサイトをSSL化しようと考えている方も多いと思います。 ここでは.htaccessを使ってhttpからhttpsにリダイレクトする方法を紹介します。 ECサイトでは、カード番号や購入履歴などの個人情報を守るためにもSSL(HTTPS)の導入は必要ですし、ECサイトでなくてもお問い合わせや相談フォームなどSSL化したほうが良い状況も多いと思いますので、導入時のリダイレクトの参考にしてみてください。 httpからhttpsへのリダイレクト httpからhttpsへリダイレクトするには.htaccessに下記を追加します。 RewriteEngine On RewriteCond %{HTTPS} off RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L] これにより、例

WEB担当者の方なら「SSL対応」が気になっていることと思います。最近では、SEOの１つとして評価されるという話も出てきていますよね。 自分もSSL（常時SSL）は必要だよなと思いつつ後手後手にまわっていましたが、やっと「WEBマスターの手帳」をSSL化しました。(まだ全てのページで完璧にはできていませんが) SSLとは まずは「SSL」とはなにかについて簡単に説明します。 SSLとは、Secure Socket Layerの略で、インターネットで暗号通信をする仕組みのことです。 WEBサイトも表示するには毎回、インターネットを使ってWEBサイトのデータが保存されている「サーバー」と通信をしています。この通信を暗号化するのがSSLです。 SSLをWEBサイトで導入すると、通信されるデータが暗号化されるので、もし第3者がデータを盗み見ても、暗号化されているため中身がわかりません。 ECサイト

WordPress サイトの HTTPS 化（常時 SSL 化）は、そう難しい作業ではありません。 でも、サーバーによっては「.htaccess」の編集が必要になるなど、初心者にとってはやや難しい部分もあります。 そんなときはプラグイン「Really Simple SSL」がおすすめ。クリックするだけで簡単に SSL 化できます。使い方を解説していくので、手順どおり進めてみてください。

この記事では、ウェブサイトをhttpからhttpsに変更する手順 (SSL化) について詳しくお伝えします。 サイトをHTTPS化すると次のようなメリットがあります。 盗聴・なりすましといった通信の改ざんを防止できるので、サイトのセキュリティが強化される サイト全体に暗号化をかけることによって、訪問するユーザーが安心してサイトを閲覧できる サイトの信頼性が上がる ①レンタルサーバーの移行 HTTPS化を行うために、wpXクラウドからXserverへ移行しました。 Check! レンタルサーバーの移行！wpXクラウド から Xserver へ Xserverは、wpXクラウドよりも細かい設定を自由にカスタマイズできます。 ②SSL証明書を取得 SSL証明書を取得します。 Googleのアルゴリズムでは、サーバー証明書の種類を問わないとのことでしたので、一番安いCoreSSLを取得しました。

更新日: 2017年3月16日公開日: 2015年3月27日海外のお洒落なWordPressテーマを日本語化する超簡単な方法 WordPressを始めるときに、まず悩むことがテーマの選定だと思います。見つけたテーマがカッコよくてオシャレなデザインであっても、いざインストールして使おうとすると、管理画面が英語で使い方や使い方がわからないなんてことありませんか？管理画面だけならまだしも、サイト上に404エラー（該当ページなし）など表示された時、表示内容が英語だとサイトの信用度低下にも影響するなどのデメリットもあります。そんな一見扱いにくそうな海外テーマも、ほとんどの場合は「英語」から「日本語」に変えたり、テーマ内の言葉を利用者側で加工することをご存知でしょうか？。そこで今回は、WordPress初心者であっても、簡単にテーマを「英語」から「日本語」に変換する方法をご紹介します！ 超簡単！英語テ

「Web担当者Forum ミーティング2015 秋」において、合同会社シマンテック・ウェブサイトセキュリティ中川 就介氏が、「Webサイト全体HTTPS化(常時SSL)の効果と実装のポイントと題してわかりやすく解説した。 すでに始まっている常時SSL化への流れ常時SSLという言葉をご存じだろうか。一般的なWebサイトでは、利用者が情報を入力するページだけはHTTPSで、トップページやログイン後のページはHTTPというケースが多い。それを、全ページHTTPS化するということだ。 銀行やECサイトではないのにそこまでする必要があるのかと思われるかもしれない。しかし、銀行やECはセキュリティ対策が進んでいるため、今は対策が進んでいないWebサイトこそがサイバー攻撃の狙い目になっている。また、クレジットカード番号やパスワードを入力させていないとしても、昨今はメールアドレス、嗜好性、cookieも保

この記事は「WordPress Theme Lightning & BizVektor 他 Advent Calendar 2016」の6日目の投稿です。 Lighting＆BizVektorコア開発者の石川さんからバトンを引き継いで、「実際にLightningを使用した」というか「Lightningだからできた」サイト制作事例をご紹介いたします。 私は職業として「Webデザイナー」を名乗っていますので、WordPressでサイト制作を行う際は、通常は既存のテーマは使用せず、案件ごとにオリジナルテーマを制作しています。 そのため、デザインから公開までは、どうしても1か月～3か月程度かかってしまいます。 しかし、あるとき、どうしても超特急でWebサイトを制作・公開しなければならない案件があり、初めて既存テーマを使用してサイト制作を行いました。 その際に使用したのが「Lightning」と「V

まず報告者に、改ざんの状況をヒアリングする。その後、ヒアリングに基づいて改ざんの有無を調査し、確認できたらWebサイトを停止する。そして、今後の調査や対応の方針を検討。状況に応じて、セキュリティベンダーなどに調査や対応を依頼する。この場合も、標的型攻撃の対応と同様に、時間との勝負だ。素早い対応が被害を最小限に抑える。 できるだけ詳細を尋ねる 報告者へのヒアリングでは、できるだけ詳しい情報を聞き出す（図2）。その情報が、今後の調査のベースになるからだ。

WPEngineというのはアメリカに本社を置く大手のホスティング企業のひとつです。 名前のとおりWordPressにとても精通している企業で、海外のWordCampでは必ずスポンサーとして参加しています。 この記事で紹介するリストはそのWPEngineさんが公開している "Disallowed Plugins" というリストです。 あらかじめ強調しておきますが、ここで紹介されているプラグインの多くはそれ自体に問題があるというよりも、不自由なインフラを使っているユーザーのニーズに応えた結果こうなったというのが現実であると思います。 なので、プラグインそのもののリストはこの記事では紹介しません。オリジナルの記事をご覧になってください。 このプラグインいいよーみたいな記事に飛びついて自分のサイトにインストールしたらハマったみたいなことは、多くの方が経験していると思いますが、WordPressプラ

設定したら次は「知ること」 このICE情報は、スマートフォンの持ち主以外が見ることができなければ意味がありません。そのため、ICEの登録情報は、端末がロックされていても表示できるようになっています。 例えばiOSの場合、パスコード入力画面の左下にある「緊急」をタップし、「メディカルID」をタップすると、ICEで登録した緊急連絡先や救急医療に必要な情報が表示されます。このように、端末のロックを外すことなく情報にアクセスが可能です。これはAndroidもほぼ同様です。 この「ICE」という情報の課題は、知名度があまり高くないであろうことです。救急隊員は、その情報の存在を知っていると思いますが、ICEがなくても作業ができるようになっているはずです。 さらに、救急医療時に特別な対処を必要とする既往症がある人の場合、この機能だけに頼るのではなく、メモとして必要な情報を記載し、財布などに入れておく、と

事前にデータベースのバックアップをとる まずは、事前にデータベースのバックアップをとっておきます。 これは、何かしら作業に手違いがあった場合でも、作業前の状態に復元できるようにしておく保険的なものです。 データベースのバックアップには、WordpressプラグインのBackWPupを利用します。 データベースのバックアップを手っ取り早く行うには、プラグインのインストール・有効化後、Wordpress管理メニューの「BackWPup → Dashboard（ダッシュボード）」メニューを選択します。 ダッシュボード画面が表示されたら、「One click backup」項目の「Download database backup」をクリックしてSQLファイルを取得してください。 すると、サイト名とデータベース名から名前が付けられた以下のようなSQLファイルがダウンロードされます。 ちなみに、これに