pixivにメニューバーを追加するUserScript(Chrome)

最近pixivのUI改悪で「作品管理」や「ブックマーク」のメニューが格納されて右上のアイコンをクリックしないと表示されなくなってアクセスが悪くなりました。よく使うメニューが格納された…という事でヘッダーにメニューを追加するためのUserSc

CSSだけでスライドするタブ切り替えを考えてみた

汎用性の高いタブ切り替えを元にスライドして切り替わる動きをCSSだけで出来ないかなぁって事で考えてみました。ちゃんと左右にスクロールしたようにスライドします。こんな感じサンプル基本構造サンプルHTML<div class="

Gutenbergでサイドバーに選択式のCSSクラス設定を追加する

Gutenbergで独自に追加したい事が多くなってきたので最近カスタマイズの勉強をはじめました。今回はクリック操作だけで既存ブロックや自作ブロックに独自のクラスを設定出来るようにしたいと思います。元々「高度な設定」から自由に追加出来るのです

【電子書籍対応】Cocoon楽天商品リンクブックマークレット

Cocoonの楽天商品リンクショートコード作成用のブックマークレットが公式ページにて公開されているのですが、楽天Koboの電子書籍には未対応だったので対応版に改変して使っている物を公開します。※以下、Cocoon公式ページで紹介されているブ

ソースコードを丸ごとパクられてしまった時の対処の記録

こんにちは、管理人の草村です。どうも最近様子がおかしいと思ったら、当ブログのデザインに関するソースコード(CSS)を丸ごとコピーされて使用されている事が判明しました！紹介したコードをコピペしたりデザインを参考にしてくださるのはまったく問題な

【続・実録】突然Amazonアソシエイトが閉鎖された後の処遇

【実録】突然Amazonアソシエイトが閉鎖されてしまった理由の続報記事です。私のアソシエイトアカウントは今年4月下旬に「過去に365日以上売り上げがなかった期間があった」事で閉鎖されました。ただ、閉鎖される直前の数ヶ月は少しばかり紹介料が発

CSSだけで使いやすく汎用性の高いタブ切り替え(複数設置対応)を実装する

先日コメントにてCocoonで使えるのオプションと使い方まとめで実装しているタブ切り替えについて質問をいただきました。これ↓このタブ切り替えは、ラジオボタンを利用してCSSだけで切り替えを実装出来るこちらのページを参考にカスタマイズしたもの

Cocoonのトップへ戻るボタンを目次に戻るボタンに変更する

Cocoonで右下に表示出来るトップへ戻る(ページ上部へ戻る)ボタンを、ページ内に目次がある時に目次に戻るボタンに変えるカスタマイズの紹介です！【設定】トップへ戻るボタンを表示する「管理画面＞Cocoon設定＞ボタン」の「トップへ戻るボタン

Cocoonのモバイルフッターメニューをヘッダー固定にカスタマイズ

Cocoon1.7.8からモバイルフッターメニューが簡単に好みのメニューに変更出来るようになり、かなり自由度が上がりました。そこで今回はCSSで簡単にモバイルフッターメニューをヘッダー固定に出来るカスタマイズを紹介します。表示サンプルこのC

CocoonのAmazonショートコードを楽天に一括で置換する

先日、Amazonアソシエイトのアカウントが突然閉鎖されました。そのためCocoonのAmazonショートコードが利用できなくなりました。今まで投稿した記事のAmazonショートコードはキャッシュが消えると表示されなくなるので、暫定的に楽天

【実録】突然Amazonアソシエイトが閉鎖されてしまった理由

こんにちは。ブログ管理人の草村です。令和が始まり晴れやかに新元号を迎える目前4月下旬、突然AmazonアソシエイトのアソシエイトIDが閉鎖されました。当ブログではほとんど利用していませんが別のレビューブログでは商品紹介の際、商品番号のみでパ

Cocoonで使える[ショートコード]のオプションと使い方まとめ

Cocoonで使えるショートコード＋オプション一覧と、使い方が掲載されている公式ページへのリンク集的なまとめです。便利な機能がたくさんあって流し見でこんな機能あったのか～！なんて発見もあるかもしれません。ジャンル分けは独断です。すぐに使い方

さくらレンタルサーバで使えるモリサワフォント書式見本

ではスタンダード以上のプランでモリサワの上質な日本語フォントをWebフォントとして無料で使用出来ます。ただ、いかんせんフォントのサンプルが用意されていないためフォント選びをするには少し不便なのでで使用出来るWebフォントを一覧にしました。利

FontAwesome4.7のアイコンをクリックでコピーできる一覧表

アイコンWEBフォントFontAwesome4.7.0のコピペが面倒だったのでお目当てのアイコンをクリックでコピー出来るようにした一覧表です。自分用に作った物ですが頑張ったので公開。簡易的な検索とか絞り込みとかも出来ます。アイコン一覧 すべ

Cocoonでパンくずリストを複製して上下に設置する

Cocoonで設置できるパンくずリストは「メインカラム手前・メインカラムトップ・メインカラムボトム・フッター手前」から1つ選ぶことができます。SEOの観点では1つあれば十分かと思いますが、訪問者さんへのナビとして上下に設置したい！なんて方へ

Cocoonの評価スター(レーティング)をハートに変更するCSS

Cocoonにはショートコードを記入するだけで簡単に評価スター(レーティングスター)を表示出来る機能が標準で備わっています。 普通に表示するとこんな感じに可愛く星が表示されます。この星をハートに変更したり、カスタマイズするCSSの紹介です。

Cocoonの吹き出しをもっとLINEっぽくするCSS

草村今回はCocoonのLINE風吹き出しをさらに本家風にカスタマイズするCSSです。冷静な男ここまで再現する必要性をあまり感じませんが…草村（それな）草村小ネタ的なCSSですがせっか...

開設1ヶ月5記事でGoogleアドセンスに一発合格した話

Googleアドセンスに初めて申請した時の話を忘れないうちに記録しておこうと思います。特に収益アップとかのお話ではなく申請時の状況はどんな感じだったか？の簡単な記録になります。申請したブログは記事数5件私が最初に開設したブログはものぐさノー

Cocoonで目次に戻るリンクを自動で設置する

Cocoonにはページ内の目次を自動で生成してくれる機能があります。この目次の位置にスクロール先から戻るリンクを設置するにはひと工夫必要になります。今回はその目次に戻るリンクのおすすめの設置方法のご紹介です。目次に戻るリンクは以前Cocoo

Cocoonの検索フォーム風スタイルをクリックで検索出来るようにする【実装されました】

2019-01-11: Cocoon 1.5.3で、この記事で紹介したコードが採用され公式で実装されました。そのためバージョン1.5.3以上をお使いの方はカスタマイズ不要となりました！＊こちらの記事は記録として残しておきます。この記事の検索

Cocoonのページ送りナビの左右を入れ替えるCSS

Cocoonのページ送りは初期状態では＜古い記事｜新しい記事＞のように、左に古い記事・右に新しい記事の配置になっています。これを左右逆に入れ替えて、＜新しい記事｜古い記事＞のような並びにするCSSの紹介です。表示サンプルコードを適用した表示

WordPressでツイートURLが埋め込みに置換されない不具合に対処する

WordPressではツイートURLを貼り付ければ自動的にツイートが取得され埋め込みツイートに置換されます。この機能が何らかの理由で処理されずURLがそのまま表示されてしまう※場合に埋め込みツイートに置換するコードを考えてみました。※テーマ