PHP php文字列のカスタマイズ WordPressなどのCMSの多くは、PHPで構成されています。 したがって、高度なカスタマイズを行う時には、必然的にPHPのプログラミングスキルが必要となります。 ここでは、PHPで文字列の切...
html mov拡張子の動画を埋め込み再生するためのHTMLタグ iphoneなどのスマートフォンで動画を撮影したとき、拡張子は通常「.mov」です。 ここでは、この「.mov」拡張子の動画をHTMLサイトに埋め込むためのタグを紹介します。 動画埋め込み用HTM...
css PC版表示のみ、改行コード<br>を有効にする方法 コンテンツが大切と言われる昨今のWEBサイトにおいて、は極めて重要な要素の１つです。 ここでは、PCやスマートフォンといった端末の差にとらわれず、全ての端末でテキストが読みやすいように最適化する方法...
css PC・スマホ表示でHTMLコンテンツの表示・非表示を切り替える方法 WEBサイトを作る際に、例えばこんなことがあります。 PC版の表示では大きいバナーを表示して、 スマホ版表示ではコンパクトなバナーを表示したい。 バナーに限らず、コンテンツや改行など、様々な要素を...
html 記事下に「いいね！ボタン」を配置するための一番簡単な方法 WEBサイトとSNSの連動が推進される今日、自分のブログやホームページの記事下にFacebookの「いいね！ボタン」を配置したいという需要が増えています。 ここでは、記事下に「いいね！ボタン」を配置するための一番簡単な方法について紹介していきます。 【STEP1】FacebookページのURLを確認する まずは、WE...
javascript・jQuery トグルで実現するシンプルなQ&Aページサンプル 上のキャプチャのような、トグルで質問への回答の表示・非表示を切り替えるサンプルプログラムを紹介します。 HTMLで質問と回答の内容を記述する まずは、HTMLでQ&Aを作っていきましょう。 HTML トグルに対応させる（jQuery） 先ほど作ったQ&Aにトグルを対応させましょう。トグルの基本については以下の記事を参...
html HTMLタグ（<div><br>など）をテキストとして表示する方法 ちょっとした備忘録や、 WEBに明るくない方向けに入力補佐を表示して起きたいとき、 HTMLタグ「<div>」や「<br>」といったタグをテキストで表示しておくと便利です。 しかし、HTMLタグで使う『<』『>』は、 普通に記述してしまうと、HTMLタグとして認識されてしまうのでテ...
css 奇数・偶数・n番目の要素を指定してCSSを適用させる記述方法 CSSを適用させるにあたって、 といった、イレギュラーな設定を行いたい場合があります。 そんなときは、CSSの「nth-child」プロパティを使いましょう。 細かくクラス名を振り分けるよりも、簡単で汎用性が高いCSS記述ができます。 「nth-child」プロパティの基本 一般的に、「E:nth-child(...
css デバイスごとにスタイルシートの適用を分ける方法 レスポンシブ対応が標準となった今日、スタイルシートはデバイスサイズごとに分けて管理するのがおすすめです。 従来、一つのスタイルシート（styles.css）に対してレスポンシブ用のタグを記述するのが一般的とされてきました。 しかし、今日ではよりハイクオリティなデザインを実現するために多くのデザインタグを活用することが...
Program GoogleMapカスタマイズに便利な「Styled Map Wizard」の使い方 店舗・企業WEBサイト制作において、 と呼べる時代となりました。 それに伴い、GoogleMapのデザインをオリジナルにカスタマイズしたいという要望が高まっています。 確かに、一般的なGoogmeMapを埋め込むよりも、 自分のサイトデザインに合わせてカスタマイズを施したGoogleMapを埋め込むことで、サイト全...
