「ケイティ物語」、甘草（リコリス）、そして我が家の秘密 - bookwormkの日記
中学のころだったかと思う、父の書棚に「ケイティ物語」という本を見つけた。作者名は、”クーリッジ”だ。読んでみたところ、ケイティという名前の娘の成長物語だった。なかなか面白かった。不慮の事故で体が不自由になった活発な少女、ケイティが、一家のまとめ役となり、やがて、奇跡的に回復していくというあらすじだ。 「若草物語」をちょっと連想させる、そのお話の作者、スーザン・クーリッジは、あとになって分かったが、「若草物語」の作者、オルコットと同じく、アメリカの女性で、生きた時代もあまり離れていない。オルコットは、１８３２年〜１８８８年。クーリッジは、１８４５年〜１９０５年だ。「若草物語」も、「ケイティ物語」も、”家庭小説”あるいは、”少女小説”の分野に入る。 そのお話の中で、とくに記憶に残ったのは、内容には関係ないのだが、”甘草（かんぞう）”というものだった。それまで、全然聞いたことがなかった。”甘草”
簡単！写真から線画を抽出するための5つの方法：Photoshop | 小樽総合デザイン事務局｜デザイン・ホームページ制作
このページでは広告を使用しています。
しらさぎ本丸ゴシック
姫路城をイメージした軽やかな丸ゴシック体フォント 姫路城（通称 白鷺城）をイメージした丸ゴシック体。舞うような優雅さと、丸ゴシックにしてはスピード感のある線の軽やかな流れが特徴です。和風なデザインを必要とするシーンや、女性らしい雰囲気を加えたいときに活躍します。日本タイポグラフィ年鑑2017入選 ダウンロード版価格 2980円（税込み） 1商品（1ライセンス）につき1ユーザー1PCのみがご利用いただけます。複数人で使用する場合は人数分をご購入ください。 収録フォント（3書体） しらさぎ本丸ゴシック、しらさぎ本丸ゴシックにじみ、しらさぎ本丸ゴシック江戸（3書体） 動作環境 Mac：システム／OS X対応（10.x）〜最新のOS X Windows：OS／日本語版Windows2000、XP、VISTA、Windows7、Windows8、Windows10 フォント形式：OpenTypeフォ
CSSのみで実装できる、画像と相性が良さそうなホバーエフェクト 15 - NxWorld
自分用にひと通りの動きを一覧化したものが欲しくて作ったのでシェアします。 リンクやボタンのホバー時にエフェクトを付けるのと同じように、画像にもホバー時に何かエフェクトを付けたいというときに使えそうなエフェクトのサンプルです。 CSS3を多用しているので全ブラウザで実装できるわけではありませんが、いずれもCSSのみを使用して実装したもので、拡大縮小・スライド・白黒・ブラー・フラッシュなど全15種類です。 共通のHTML・CSS サンプルはいずれも下記のようなHTMLを使用しており、CSSについても共通スタイルとしてそれぞれに指定しています。 CSSでは幅や高さを指定している部分もあるので、参考にされる際はこれらを自身の環境に合わせて調整してください。
CSSのコピペだけ！おしゃれな見出しのデザイン例まとめ68選
今回は見出し（h1〜h6タグ）のオシャレなデザインサンプルを68つ紹介します。CSSコードをコピペすればそのまま使うことができます。もちろん自分好みにカスタマイズして使って頂いても構いません。
【RMSの裏技】禁止タグを使ってCSSやiframe、jsファイルを読み込む方法
楽天市場はGOLD部分では自由に作りこむことができる反面、RMS上のデザイン部分には禁止タグが多く自由度が低い。 PC版はまだヘッダー、フッター、レフトナビでGOLDで造ったパーツを読み込めますが、特にスマホデザインはそうもいきません。 しかし、実は楽天RMSの制限を回避して楽天市場上で禁止タグを使う方法があるのです。 楽天RMSの禁止タグ制限を突破する方法 タグの<>内に 「 ="" 」や全角スペースを11個入れることでRMS上で禁止されているタグを利用することができます。 全角スペースの数は13個とか18個とか諸説ありましたが、11個で動作確認済みなので11個でいいかと。無駄に増えるとミスが増えますし。 例えばiframeタグやCSSの読み込みにくわえ、class=""タグも使うことも可能。これによってかなりアグレッシブにページを作りこむことが可能です。 禁止タグ突破裏技の実装コード例
【楽天スマホヘッダーカスタマイズ】 デフォルトのヘッダーを隠さずに独自のヘッダーを出す | EC通販運営マニュアル
楽天固有のヘッダーを隠すのは罰点加点対象 スマホページで独自ヘッダー使ってるお店は要注意！ 楽天の商品ページやカテゴリーページのスマホ表示時、オリジナルヘッダーを設置して楽天のヘッダーを隠しているお店も多いかと思います。 もともと規約違反だったがついに罰点加点の対象に。 その猶予期間が2017年4月30日までだったのか、4月27日に2017年7月31日までに延長されました。 とはいえお店独自のヘッダーを出したいお店さんもいらっしゃるでしょうから、その制作担当の方のために一つ提案をば。 イーザッカマニアさんのヘッダーが素敵！ イーザッカマニアさんの解決策が素敵です そんなわけで、楽天のスマホヘッダーを出しつつ自ショップのヘッダーも出してオシャレに両立させたイーザッカマニアさんのデザインをご紹介。（※2017年5月現在） 楽天固有のナビパーツをしつつ、しっかりとイーザッカマニアさんの個性的なヘ
WordPressで特定のファイルの拡張子やmime形式を取得する「wp_check_filetype」｜今村だけがよくわかるブログ
WordPressのデータベース構造のページを見るとわかりやすいんですが、投稿タイトルや本文データなどが入っている「wp_posts」テーブルには、フィールド「post_mime_type」があります。 「post_mime_type」にはmime形式「image/png」や「image/jpeg」などが入るんですが、例えば「wp_insert_attachment」を使った時、設定するパラメーターの一つとして「post_mime_type」の値を与えてあげないといけないです。なので、そんな時には私は「wp_check_filetype」を使ってmime形式を取得しています。 「wp_check_filetype」の使い方 基本形<?php wp_check_filetype( $filename, $mimes ) ?> パラメーター$filenameファイル名、またはパス $mimes
アイキャッチ画像の「URL,横幅,高さ」を取得する[WordPress]
まえがき 前回「アイキャッチ画像のURLを取得する」方法は書きましたが もっとシンプルな方法を発見しましたので、エントリーします。 合わせて「アイキャッチ画像の横幅と高さを取得する」方法も紹介しますにゃー。 アイキャッチ画像の「URL,横幅,高さ」の情報を取得するタグ「wp_get_attachment_image_src」 wp_get_attachment_image_srcというタグを使えば アイキャッチ画像の「URL,横幅,高さ」が配列で返ってきます。 アイキャッチのサイズ指定（thumbnail, medium, large, full）もできます。 記述例 $thumbnail_id = get_post_thumbnail_id($post->ID); //アタッチメントIDの取得 $image = wp_get_attachment_image_src( $thumbnai
![アイキャッチ画像の「URL,横幅,高さ」を取得する[WordPress]](https://cdn-ak-scissors.b.st-hatena.com/image/square/ae275e8fa003aceaddee05ec058e47eee609dda6/height=288;version=1;width=512/https%3A%2F%2Fkotori-blog.com%2Fwordpress%2Fwp-content%2Fplugins%2Fwp-ogp%2Fdefault.jpg)
カテゴリに画像のカスタムフィールドを追加する方法[WordPress]
まえがき WordPressのカテゴリに画像を登録して表示したい時があると思います。 そんな時、KoToRiは『Advanced Custom Fields』というプラグインを使用し、カテゴリに画像をアップロードできるカスタムフィールドを作成します。 正直、WordPressのカスタムフィールドのプラグインは『Custom Field Template』一択なのですが、『Custom Field Template』はカテゴリにカスタムフィールドを作成できません。なのでカテゴリにカスタムフィールドを設定したい場合だけ『Advanced Custom Fields』を『Custom Field Template』と平行して使用します。 記事にカスタムフィールドを追加するだけなら『Custom Field Template』を使用すれば十分かと思います。 Custom Field Templat
![カテゴリに画像のカスタムフィールドを追加する方法[WordPress]](https://cdn-ak-scissors.b.st-hatena.com/image/square/c716ab1f9c25201bdc0b4ca7492309a7eb0b406d/height=288;version=1;width=512/https%3A%2F%2Fkotori-blog.com%2Fwordpress%2Fwp-content%2Fuploads%2Fthumb4.jpg)
[WordPress] 画像挿入時にリンク先が画像の時のみ、aタグに独自クラスを付与する方法
ライトボックス系で画像の拡大表示をしたい時など、aタグに独自クラスを付与したい場合があると思います。そんな時に自動的にHTMLにクラス付けする方法です。 image_send_to_editor フィルターフックを使う image_send_to_editor フィルターフックを使用すると、投稿画面から画像挿入する際に出力されるHTMLを加工できるので、これを使うのがよいようです。 画像へのリンクタグに一律でクラス付与する場合は以下のように、functions.php へ記入すればOKです。 add_filter( 'image_send_to_editor', 'addClass' ); function addClass( $html ) { $class = 'myClass'; // ←付けたいクラス名が入ります。 return str_replace( '<a ', '<a cl
![[WordPress] 画像挿入時にリンク先が画像の時のみ、aタグに独自クラスを付与する方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/98d899b3e6cfaeed07de9932a89bf89d4863472c/height=288;version=1;width=512/https%3A%2F%2Fmemocarilog.info%2Fwp-content%2Fuploads%2F2013%2F11%2Fimages.jpeg)
CSS最適化から圧縮までできる「gulp-pleeease」 | ブログ - Blog | 佐藤純平 - Jumpei Sato
はじめに CSSのベンダープレフィックスの付与はいちいちやると面倒ですよね。必要ないのも書いてしまっていたり。。 今回はそんな問題を解決してくれる、「gulp-pleeease」の紹介です。 gulp-pleeeaseとは タスクランナーGulpのプラグインのひとつです。 Sassの使用から、CSSのベンダープレフィックスの付与、圧縮、メディアクエリを一つにまとめる等、使えるオプションが豊富なのが魅力です。 まずインストール 「Node.js」、「Sass」はインストール済みの想定で進めます。 ディレクトリで下記のコマンドを入力します。 なお、下記のコマンドはMac用です。 「package.json」の作成 npm init 「gulp」のインストール sudo npm install --save-dev gulp 「gulp-pleeease」のインストール sudo npm ins
表示する言語をボタンで切り替えるjQueryのプラグイン
投稿の日本語表示と英語表示をボタンひとつで切り替える機能があったら良いかもしれない、と思って、jQueryのプラグインを作成しました。ブラウザの言語設定を参照してそれにあった言語を表示する機能もあります。 <!DOCTYPE html> <html> <head> <style> /* for buttons */ .langbuttons a { margin-right: 5px; padding: 5px 10px; border: 1px solid #ccc; border-radius: 3px; background: #eee; cursor: pointer; } /* when the button is pushed */ .langbuttons a.on { background: #666; border: 1px solid #000; color: #fff
簡単！可変グリッドレイアウトが作れるプラグインまとめ | Web Design Trends
可変グリッドレイアウトとは、画面の幅を変更することでグリッドが最適な配置に整列するようなグリッドレイアウトのことを言います。 レスポンシブデザインとの相性がいいのはもちろん、PCでの表示でもデバイスに最適なサイズでレイアウトを調整することができるというメリットがあります。 そんな可変グリッドレイアウトのWebサイトを簡単に作ることができるプラグインをまとめました。 Masonry グリッドレイアウトを実装できるプラグインの中では最も有名なのがMasonryなのではないでしょうか。ちなみに、当サイトのトップページもMasonryを使って作られています。 Masonryの特徴は、レイアウトに関する様々なオプションが用意されている点です。 グリッド幅のパーセント指定や、グリッド感のマージンの幅などのデザインはもちろん、グリッドの追加、削除、クリックによる拡大などが行えるメソッドも用意されているた
【★★★ - ｊＱｕｕｅｒｙ】 - クリックで開くアコーディオンメニュー
スマートフォンにも使える、クリックで開くアコーディオンメニューjQuery スマートフォン等、限られたスペースで複数のコンテンツを設置できるアコーディオンメニュー。 シンプルなコードで動作しますので、実装してみてはいかがでしょうか。 デモページ DEMO 説明 今回は2種類のアコーディオンを紹介します。 1つは「ul」で組むリスト、もう1つは「dl」で組むリストです。 なお、「ul」リストは複数開くことができ、「dl」リストは別のタブが閉まるようになっていますので使い分けて見て下さい。 JS $(function(){ $(".accordion p").click(function(){ $(this).next("ul").slideToggle(); $(this).children("span").toggleClass("open"); }); $(".accordion dt"
全部無料！Illustratorの無料ブラシセット44（総数900ブラシ以上！）part2 | co-jin
全部無料！Illustratorの無料ブラシセットの第二弾です。 以前の記事「全部無料！Illustratorの無料ブラシセット34（総数800ブラシ以上！） 」が、おかげさまで多くの皆様にご覧いただいているようですので、続編です。 ボリューム的には前回よりも増やしてみました。 全部で44セット、ブラシ単体では900を超えています。 Illustrator用のブラシをお探しの方にとってご参考になれば幸いです。 ライセンスについては、明示されているものについては明記していますが、不明瞭なものについては明記していません。 すいません。調べてみたんですが、すぐにはわかりませんでした…。 各ファイルに記載されているライセンスを事前にご確認のうえ、ご利用ください。 Illustratorにブラシを登録する方法 ダウンロードしたブラシファイル（.ai)を、Illustratorに登録して使用する方法は
地味に便利！selectボックスをユーザーフレンドリーにするjQueryプラグイン「Chosen」
セレクトボックスって選択項目が長くなると幅が広がったり、項目がいっぱいあると下のほうが見つけにくかったりしますよね。 ｊQueryプラグインのChosenを利用すると、指定した幅で文字を折り返したり、検索機能をつけることができ、利用者によって使い勝手がかなり良くなります。 sponsors 使用方法 Chosenからファイル一式をダウンロード。 JavaScriptを以下のように記述します。 <link rel="stylesheet" href="chosen.css" /> <script type="text/javascript" src="jquery-1.9.1.min.js"></script> <script src="chosen.jquery.js"></script> <script type="text/javascript"> $(function(){ $(".
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://learn-from.net/csvimport/
eky.hk
https://www.ituore.com/entry/html-css-basic
