WordPressでカテゴリやタグに設定した説明文を表示させるcategory_descriptionやtag_description。ここで自動挿入されるPタグを除去する方法をご紹介します。 WordPressでカテゴリーページやタグページの概要(description)を表示する際に、デフォルトで出力される<P>タグを消去する方法。category_description() や tag_description() 関数の背景とともにご紹介します。 term_description() のPタグが邪魔 wpautopフィルタを切る WordPressで概要を表示する関数であるcategory_description() や tag_description() を使うとPタグに挟まれて表示されます。 段落扱いになるのでインラインや見出しとして使う場合は表示が崩れるし、コード的にも美しくあ

世界中のブランドや会社のロゴ、シンボル、トレードマークをコレクションしているサイトを紹介します。 ロゴをデザインする時の勉強に、また単に眺めているだけでも楽しめます。

CSS3 のfilter で加工ソフトなしで画像に効果を加えてみる CSS3 のfilter を試してみました。 サンプル 画像を選択して、input "range"で、filter の効果を付与できます。filter の効果を重ねることもできます。 cartman0.github.io filter: grayscale(100%) にした場合 対応ブラウザ CanIuseで確認すると、現時点（2015年07月03日）では、Firefox 以外はベンダープリフィックスが必要のようです。 Can I use... Support tables for HTML5, CSS3, etc 対応しているベンダープリフィックスは、-webkit- のみのようです。 IE は対応していません。 したがって、以下のように2つ指定してあげれば良さそうです。 XX { -webkit-filter: YY

Webデザインをしているときに、配色に詰まって作業がはかどらないということは多々あるのではないでしょうか。 そんなときは、自動で配色パターンを生成してくれるサービスやツールに頼ってみましょう。 そこで今回は、Webデザインの配色に役立つ12個のツールをピックアップして紹介します。 1. Adobe Color CC https://color.adobe.com/ja/ 「 Adobe Color CC 」はAdobeが無料で提供している配色ツールで、元々は「Kuler」という名称で提供されていました。 「類似色」「モノクロマティック」「トライアド」など6種類のカラールールが用意されており、色彩と明度を好みで調整可能となっています。 さらに、画像をアップロードすると色を抽出して配色パターンを作成するという機能も備わっています。 納得いく配色パターンができないときは、「探索」のメニューからパ

良いデザイナーはデザインするだけでなく、細心の注意を払うことができる人です。 Web制作におけるチーム内、または個人でもPhotoshopでのデザイン作業やワークフローを効率よくするためのルールを紹介します。 チーム内やデザイナー同士でルールを明文化しておくと、いいですね。

電子書籍出版社のNEXTBOOKは9月1日、マークアップ言語を利用したiOSアプリ開発ツール「NextScript1.0」を無償公開した。法人、個人を問わずあらゆる利用が無償で、開発したアプリやプラグインの販売も自由。 NextScriptは、HTMLライクなマークアップ言語を利用することで、Objective-C言語を使わずにiOSアプリを制作できる。同社の電子絵本アプリの制作を効率化するなかで作られ、「クリエーター自身がスクリプトを書けることを狙って開発された」という。 徹底的に簡素化したスクリプトが特徴で、オブジェクトのクラスは17種類、ロジックを記述する構文は5種類のみ。HTMLやActionScriptなどの経験が多少でもあれば、1日で習得が可能という。メモリ管理をスクリプトエンジンが行うため、メモリ管理の知識が不要なのも特徴だ。ビルドの際にはXcodeが必要となる。 デフォルト

はじめまして！ みなさま、はじめまして！@akio0911と申します。 自由大学にてアプリクリエイター道場という講義をやったり、cocos2d for iPhoneレッスンノートというゲームアプリ開発の入門書を執筆したり、ハイパーアプリクリエイターズというインタビュー番組を制作したりしています。 また、拡張現実ライフというブログを運営しているブロガーでもあります。 このたび、AppBankさんにて、アプリ開発入門の連載記事を執筆させて頂くこととなりました。ぜひぜひこの連載を読んで、アプリ作りの第一歩を踏み出してみて下さい！ 第1回の目次です。 iOSアプリ開発に必要なものは？ Xcode 4のインストール 早速アプリの作り方を学んでいきましょう。 iOSアプリ開発に必要なものは？ iOSアプリを開発するには、以下に挙げるものが必要となります。 Mac iOSアプリを開発するには、Intel

以前より紹介している国産テーマ、LIQUID PRESSから先日WordPress無料公式テーマとして新しいテンプレートがリリースされました。 そこで今回は、新たにリリースされたWordPress無料公式テーマ「LIQUID」の紹介をしたいと思います。 この公式テーマは、LIQUID PRESSシリーズの元になったテンプレートで、無料で簡単に利用できるシンプルなテンプレートになっています。 有料のWordPressテーマはちょっと不安という方は、一度無料の日本語対応公式テーマ「LIQUID」を試してみてはいかがでしょうか。 目次 WordPress無料公式テーマ「LIQUID」の特徴 WordPress無料公式テーマ「LIQUID」の外観イメージ紹介 WordPress無料公式テーマ「LIQUID」の価格・仕様・動作環境 WordPress無料公式テーマ以外のテンプレートにはどんな機能があ

CSSの登場から20年。この間、CSSはものすごく進化していました。「それって昔のやり方ですね」なんて言われないように、今後のサイト制作でチェックしておきたい最新のプロパティ（と関数）が学べる記事を9つ、厳選して紹介します。まだまだドラフト段階の仕様もありますので、各自記事の解説をチェックしてください。 1.グリッドレイアウトが捗るGrid Layout Module 『CSSレイアウトの常識が変わる！Grid Layout Moduleが胸アツ』（WPJ） CSSのレイアウトといえば、伝統的にはfloatプロパティ、最近ではFlexboxをよく使いますよね。仕様策定中の「Grid Layout Module」なら、もっと効率が上がりそうです。 2.テキストの回り込みが簡単に！ CSS Shapesプロパティ 『CSS Shapesでテキストを回り込ませるレイアウトを表現』（Webクリエイ

Transcript ϑϦʔϥϯεσβΠφʔͷ � ʮͭ͘ Δ͜ͱɺ ͸ͨΒ ͘ ͜ͱʯ ࣗݾ঺հ ͢Έͩ͋΍͔ ʢ֯ాҁՂʣ 8FCσβΠ ϯˍΠ ϥε τ Ϩʔλʔ େࡕࡏॅɺ ੍࡞ձࣾͰͷ8FCσβΠφʔΛܦͯ����೥ʹϑϦʔϥ ϯεʹɻ ओʹ-1΍αΠ τͷσβΠϯɺ ΠϥετΛ੍࡞͍ͯ͠·͢ɻ ෉ ͱ�ࡀͷஉͷࢠͱ ͏͕͗͞�ඖ͍·͢ɻ Ωϟ ϦΞ͚ͩ͸ ��೥ʹ ɾ ɾ ɾ ࠓ೔ͷ͓͠ͳ͕͖ σβΠϯΛ࡞Δ ʮཧ࿦ʯ ͱ ʮϏδϡΞϧʯ � ཧ࿦ฤ � ϏδϡΞϧฤ � σβΠϯͷઆ໌ฤ ϑϦʔϥϯεͱͯ͠ಇ͘ Θͨ͠ͷ৺ಘ 01 02 ࠓ೔ͷͶΒ͍ ࠓ೔ͷςʔϚ͸ ʮσβΠϯࡇʯ ɻ ʮσβΠϯ͸໰୊ղܾʯ ͜ͷ͜ͱ͹Λͣͬͱ؊ʹ໏͡ ͖͚ͯͨΕͲɺ ࠷ۙͲ͏΋ͬ͘͠ Γ͜ͳ͍ɻ ࠓ೔ͷͶΒ͍ ݟͨ໨͚͕ͩσβΠϯ͡Όͳ͍ɺ Ͱ΋σβΠϯͷத Ͱɺ ͖Ε͍ͳ৭ɺ ͖ͯ͢ͳϑ

99designsのこれまでの成長ぶりから判断して、今年は重要な年になりそうです。本サイトはかつてないほどの速さで進化を遂げているので、ぜひデザイナーの皆さんも一緒に成長してほしいと願っています。 優れたデザイナーになる12の方法を紹介しますので、毎月1つ試してみてください。新しいスキルを学び、新たなヒントを生かしていくことで、さらに優れたデザイナーになりましょう。 1. グリッドの使い方を習得する — ウェブサイトであろうと印刷物であろうと、デザインする上でバランスのとれたレイアウトを決定することは、最も難しく、非常に悩ましい作業の一つです。しかし、この問題はグリッドがあっという間に解決してくれます。グリッドを使えば、いつもの試行錯誤を繰り返すことなく、レイアウト作業を系統立てて行うことができるのです。 この方法なら、グリッドに沿ってレイアウトを決めていけばいいので、コンセプトやタイポグ

デザインという単語は主にかっこいいものをセンスで作ると認識されがちです。 ですが、デザインは本来「設計する」と訳され、意図を伝わりやすくするために情報構成を考えることを指します。中にはセンスや感覚でこなせる人もいますが、法則さえ抑えればある程度のデザインなら誰でも理解し実践できます。 今日は自分にはデザインセンスがない、と落ち込んでいる方に、この記事では役立つ10サイトを厳選して紹介します。 デザインの原則・理論 １.  デザイナーに言われた「非デザイナーが気をつけるべきデザインの「４原則」 ハズさないデザインの4原則（近接・整列・反復・コントラスト）が分かりやすく解説されています。実際に具体例を比較しているので感覚的にも理解することができます。 ２.  感覚派デザイナーも知っておいて損はない「デザインの要素と原則」 デザインの前提・デザインの要素・ゲシュタルト原則・デザインの原則の4つの

TL;DR リニューアルを行った時に、CSS3 で気づいたことや次回もまた使いそうなものなどを備忘録として書いておきます。基本的なものから見慣れないものまで。 CSS3 オートフィルの背景色を解除 chrome にて、テキストボックスのオートコンプリートした際、背景色が黄色になります。これを消したかったので を追記。色指定の箇所に任意の色を指定できますが、とりあえず白色で。 無事消えました。 Coderwall | Change background color for autocompleted inputs in Google Chromeでinputがオートフィルされてると背景色が黄色になるのを回避 – CSS | ごろつきめも backface-visibility で Chrome のチラつきを解決 fadeIn などのアニメーションを取り入れると Chrome でヘッダーやサイ

ウェブサイトをもっと簡単に作成したいというときは、HTMLやCSS、JavaScript、画像などをセットにしたHTMLテンプレート素材を活用してみましょう。あらかじめデザインや機能が実装されているので、テキストエディタで文字を編集するだけで、魅力的なサイトデザインに仕上げることができます。 今回は、デザイン性だけでなく使いやすい、無料ダウンロードできるHTMLテンプレートをまとめています。素材はどれもあらゆる画面サイズに対応できるレスポンシブWebデザインという点もポイントです。 詳細は以下から。 無料で使える！レスポンシブWebデザイン対応のHTMLテンプレート素材まとめ Synthetia 余白たっぷりのコンテンツ用レイアウトに、洗練されたアニメーションエフェクト、落ち着きのある配色カラーパレットなど、すぐにウェブページを作成したいときに。 デモページ ダウンロード Apollo 写

いざコンテンツマーケティングを取り入れようと思っても、はじめての人はどこから手をつけてよいか見当がつかない人も多いかもしれません。今回は本書のChapter2「コンテンツマーケティングの始め方」より、コンテンツマーケティングの戦略の立て方の概要について見ていきましょう。 2016年7月1日／執筆：渡辺一男（株式会社日本SPセンター）

一昔前はプロプライエタリ・ソフトウェアが一般的だったテキストエディターも、多くがOSS(オープンソースソフトウェア)化を選択するようになった。アジャイル開発が進む開発の現場でも「Atom」など、OSS製テキストエディターを選択する場面が増えているが、今回取り上げるのはAdobe SystemsがOSSとして公開している「Brackets」である。 Adobe Systems製OSSテキストエディター「Brackets」。本体自身もHTMLやCSS、JavaScriptで開発されている。最初から日本語化(OSのシステム言語に依存)されているのもうれしい HTMLやCSS、JavaScriptのコーディングに特化したOSS製テキストエディターとして、2011年12月から開発をスタートし、2016年6月には最新版となるバージョン1.7をリリースしたばかりだ。ソースコードはもちろん、Windows

エックスサーバーで運営している WordPress サイトを HTTPS 化する方法を詳しく解説していきます。 見慣れない単語が並ぶだけで難しそうに感じるかもしれませんが、手順通りやっていけば 1 時間ほどでできますよ（慣れれば 10 分ぐらい）！ Google は HTTPS をランキングシグナルに採用していますし、セキュリティを向上させるのは読者のためにもなりますから、ぜひやっておきましょう。 HTTPS 化（常時 SSL）とは ブログ全体を HTTPS にすることを「常時 SSL 」といいます。 要するに、ブログの URL が「http://naifix.com」から「https://naifix.com」になる、と覚えておけば OK です。 HTTPS 化によって、「暗号通信で読者が安全にサイトを閲覧できる」ようになります。また、ほんの少しだけ検索に有利になる可能性もあります。読者

ブラウザごとに異なるHTMLの各要素のスタイルの相違を吸収し、各要素のデフォルトのスタイルが定義されたCSSリセット用のスタイルシートを紹介します。 normalize.cssを最近のWeb制作にあうようカスタマイズされたもので、対応ブラウザはすべてのモダンブラウザ、IEは8+対応です。 ress -GitHub 参考: normalize.cssの特徴とコード 2015年、Web制作者が押さえておきたいCSSの各種リセット ressの特徴 ress: html, グローバルセレクタの定義 ress: 一般的な要素の定義 ress: フォーム要素の定義 ress: メディア要素の定義 ress: アクセシビリティ用の定義 ress: ::selectionの定義 ressの特徴 ressは「normalize.css」をカスタマイズしたもので、スタイルシートを始める時のしっかりしたベースな