ニッチな話題

[Cocoon] カルーセルの「CLSに関する問題」を改善したいけれど難しそう

[Cocoon] カルーセルの「CLSに関する問題」を改善したいけれど難しそう

読んでいる文章をずらされると腹が立つだろう。だから、そういうページは直した方がよい。さて、どうやって？　という話。CLS（累積レイアウト変更）とはウェブページはあとから画像が表示されると、下にある文章がずれます。これを「累積レイアウト変更（CLS：Cumulative Layout Shift）」といいます。広告が多いページだと気になるのよねーユーザーの利便性が大事Googleサーチコンソールでは、このようなレイアウトのずれを指摘してくれます。CLSに関する問題：0.25超（...

2021.01.04 2023.07.03

ニッチな話題ホームページ運用

macOS Big Sur 11.1にアップデートした話【HDDの空き容量が増えた】

macOS Big Sur 11.1にアップデートした話【HDDの空き容量が増えた】

基本システムをアップデートする通知が来ると、何が更新なんだろうと気になります。HDD容量に余裕がなくて、ちょっと保留していたんですが、ようやくできました。macOS Big Sur 11.1アップデートの通知2020年12月15日にソフトウェア・アップデートの通知がきました。2020年12月15日macOS Big Sur 11.0.1から11.1へのアップデートです。夜間にインストールされるということで、翌朝見てみると「インストール未完了」。自動インストールできなかったアッ...

2020.12.25 2020.12.26

ニッチな話題パソコン基礎知識

[mac] アップデートしたらGmailのサインインが必要だった

[mac] アップデートしたらGmailのサインインが必要だった

macOS Big Sur 11.1にアップデートしたところ、「Googleアカウントのパスワードを入力する必要がある」という通知が表示されました。そのレポートです。macOSでのGoogleアカウントの認証パソコンでもスマホでも、アップデートをした後にアカウント認証が必要になることがありますね。表示された通知「GOOGLEのパスワードが必要です」GOOGLEのパスワードが必要ですxxx@gmail.comのパスワードを"インターネットアカウント"で入力「インターネットアカウ...

2020.12.25 2024.09.23

ニッチな話題パソコン基礎知識

miエディタでCSSの見出し表示をする

miエディタでCSSの見出し表示をする

miエディタにしたのは、そろそろCSSを整理しようと思ったからです。いろんなスタイルを継ぎ足していったので、重複や記述方法のばらつきがあって、ちょっと見直したくなってきました。そのために必要なのが、エディタの「見出し表示」機能。miの見出しの指定方法をレポートします。モードをCSSにするまずは、テキストのモードを選びます。初期値は「標準」なので、画面上のメニューから「CSS」を選びます。これで、構文に合わせてコードに色付けされます。見出しの設定そのままでは見出しリストは空っぽ...

2020.12.23 2022.07.31

ニッチな話題パソコン基礎知識

macのエディタでmiをインストールした話

macのエディタでmiをインストールした話

わたしは、文章をメモするときにテキストエディタを利用しています。起動が早いからです。テキストエディットはプレーンテキストのエディタではないところが、macのデフォルトのテキストエディタは、「テキストエディット」は、起動すると「ファイルを選ぶ画面」が表示されます。すぐに白紙が表示されないんですね。しかも、ファイル形式は「リッチテキスト形式」になっています。軽快にプレーンテキストを編集したい、という用途のアプリではないようです。メモアプリでもいいけれど……「メモ」アプリでもよい...

ニッチな話題パソコン基礎知識

[WordPress] 設定したCSSが一部反映されない【LiteSpeed CacheのCSS結合の注意点】

[WordPress] 設定したCSSが一部反映されない【LiteSpeed CacheのCSS結合の注意点】

設定を変更していたら、ログアウトしてウェブページを見ると、スタイルシートがおかしいことに気づきました。スタイル適用の優先順位がおかしいWordPressにログインすると意図したとおりのスタイルが表示されているのですが、ログアウトすると一部に元のスタイルが適用されています。微妙な違いなんですが気づきますか？ログイン時の表示は意図したとおりのスタイルです。しかし、目次をみると、背景色は変更したstyle.cssで上書きスタイルになっているのですが、枠線の色がテーマのスタイルのまま...

2020.12.23 2023.07.16

ニッチな話題ホームページ運用

Googleアドセンスのアンカー広告を下に固定する[Cocoon]

Googleアドセンスのアンカー広告を下に固定する[Cocoon]

スマートフォンのユーザーの画面上下にずっと表示する広告を、アンカー広告（あるいはオーバーレイ広告）といいます。アンカー広告がメニューバーと重なると不便なので、今回はGoogle広告のアンカー広告の位置を変更しようと思います。ウェブサイト運営者向けの話ですポイントスクリプトで上部アンカー広告を抑制できる。上下にメニューがあると、アンカー広告の配置に影響がある。【追記】パソコン画面にも表示されるようになります。（2021年7月9日）追記（2023-07-17）アンカー広告の位置指...

2020.12.22 2023.07.17

ニッチな話題ホームページ運用

XML sitemapをAIOSEOからGoogle XML Sitemapsプラグインに変更した

XML sitemapをAIOSEOからGoogle XML Sitemapsプラグインに変更した

ウェブサイトのsitemapを作っておくと、記事を追加したときに検索エンジンに認識してもらいやすくなります。↑サーチコンソールについて知りたい。これまで、「AIOSEO（All in One SEO）」プラグインを利用していたんですが、どんどん機能が増えたので、代わりのものを探してみました。今回は、なるべくシンプルで単機能のサイトマップ作成プラグインを探しました。追記：2021年3月26日久しぶりに見たらプラグイン名が変わっていました。設定項目が重複しているというのも、わたし...

2020.12.21 2021.03.26

ニッチな話題ホームページ運用

note風スタイル第5弾！引用とコード

note風スタイル第5弾！引用とコード

note風デザインもそろそろ簡単な微調整です。今回は引用文（blockquote）とコード（pre）のデザイン。ビフォア・アフター元のデザインに比べて、小さくグレー基調にしました。以前は引用部分が長いと「うるさい」印象があったので、全体が見通せるようになりました。ただ、文字は少し小さいかもしれません。こんな感じの引用。こんな引用元code is here { something.}引用ブロック引用ブロックは、かなりスッキリしました。.entry-content blockqu...

ニッチな話題ホームページ運用

note風スタイル第４弾！目次のデザイン

note風スタイル第４弾！目次のデザイン

「note風スタイル」ということで、ブログのスタイルシートを編集しています。今回は、目次について。主な変更点は……文字を細く・小さく・薄く背景色をグレーに項目の間に線を追加noteの目次の特徴は、「控えめ」なこと。記事によっては目次を付けていないものも多いです。目次（table of contents）のHTML構造.toc.toc-title.toc-contentol.toc-listliaリスト構造（ol, li）とアンカーリンク（a）の関係で、かなり複雑な入れ子になっ...

ニッチな話題ホームページ運用

[Cocoon] ブログ記事の作成日時・更新日時を２段にする【white-space pre】

[Cocoon] ブログ記事の作成日時・更新日時を２段にする【white-space pre】

ブログ記事のタイトル部分のスタイルを少しいじりました。作成日時と更新日時を２段になるようにしました。こちらがCSSです。.entry-header .date-tags { order: 3; color: #a8abb1; font-size: 16px;}.entry-header .date-tags .post-update:after { content: "\A" ; white-space: pre ;}少し、文字の色や大きさも変更していますが、メインになるのは...

2020.12.21 2021.03.22

ニッチな話題ホームページ運用

WordPressのバックアップ復元がずっと終わらない…… 【Softaculous】

WordPressのバックアップ復元がずっと終わらない…… 【Softaculous】

ヒヤリとした話です💦WordPress 5.6のアップデートが思うようにいかず、いったんバックアップから5.5に復元することにしました。そのときに、バックアップ作業がずっと進まない状況になったので、レポートします。注意バックアップに失敗するとデータを失う場合があります。十分に注意した上で、自己責任で操作して下さい。WordPress 5.5に戻したいWordPress 5.6にアップデートしたところ、よく使っているプラグイン（Change Block Keywords）が対応...

2020.12.21 2020.12.25

ニッチな話題ホームページ運用

note風スタイル第３弾！ Cocoonのアイキャッチをタイトルの上に変更した【display-flex】

note風スタイル第３弾！ Cocoonのアイキャッチをタイトルの上に変更した【display-flex】

Cocoonのアイキャッチ画像は、既定ではタイトルの下に表示されます。今回はアイキャッチ画像をタイトルの上に表示されるように、スタイルシートを編集しました。これもnoteのデザインを参考にしています。タイトルと本文の位置が近くなるので、読みやすいですよね。Cocoon設定やPHP編集もいいけれど……アイキャッチ位置を変更する方法をざっと調べると…Cocoonの設定でアイキャッチを非表示にして本文中に画像挿入する方法content.phpを書き換えて表示位置を変更する方法が紹介...

2020.12.20 2020.12.21

ニッチな話題ホームページ運用

note風スタイル第２弾！モバイルメニューを編集

note風スタイル第２弾！モバイルメニューを編集

こんにちは。以前、noteのような読みやすいブログを目指して、スタイルシート（CSS）を変更しました。前回は、パソコンでもシングルカラムの方が読みやすいのではないか、というテーマでした。今回のメインはモバイルメニューです。どうすれば、スマホユーザーにとって集中して読みやすいか、というテーマでnoteのUIを参考に、ブログのスタイルをいろいろ試してみましたので、レポートします。モバイルメニューボタンをいろいろ変更した上部バーはすっきりさせました。下部バーはLINE登録、ツイッ...

2020.12.19 2023.07.13

ニッチな話題ホームページ運用

Google AnalyticsでページのクリックURLを記録する【Google タグマネージャーの組込み変数】

Google AnalyticsでページのクリックURLを記録する【Google タグマネージャーの組込み変数】

ウェブサイトのアクセス解析にGoogleアナリティクスを使っていますが、外部サイトのクリック数がありません。Googleタグマネージャーで通常ページのアクセスは計測できたものの、AMPページでうまくいきませんでした。GoogleタグマネージャーのAMPコンテナについて、レポートします。AMPページのクリックURLについてJavaScriptコードを追加して再挑戦しました。クリックURLを計測したいならタグマネージャ外部サイトのクリック数を計測したいと思いました。紹介したどのペ...

2020.11.30 2021.10.22

インターネット小話ニッチな話題ホームページ運用

macOS Big Sur 11.0.1で親指シフトできるのか？【実際にアップデートを試してみた】

macOS Big Sur 11.0.1で親指シフトできるのか？【実際にアップデートを試してみた】

macOSの更新通知が来たので、さっそく更新してみました。親指シフトの入力支援アプリなどが動作するか心配だったのですが、無事に利用できました。今回は、macOS Big Surアップデートの流れをレポートします。ポイントmacOS Big Surは、かなり大きなアップデート！ネットで不具合を確認してから更新した方が安心親指シフト環境は問題なく使えた空き容量が思った以上に必要（約50GB）注意事項macOS Big Surのアップデートは、かなり大きな変更です。古いmac...

2020.11.18 2023.04.26

ニッチな話題パソコン基礎知識

「macOS Catalina 10.15.7追加アップデート(2020-11-05)」ではフォント読込のバグが修正された

「macOS Catalina 10.15.7追加アップデート(2020-11-05)」ではフォント読込のバグが修正された

こんにちは。macbookを使っていたら、ソフトウェア・アップデートの通知がありました。どんな更新内容なのか、ざっとメモしておきます。ソフトウェア・アップデートの通知が表示されるソフトウェア・アップデート"macOS Catalina 10.15.7追加アップデート"が利用可能で、夜間にインストールされ…「詳細」をクリックすると、「システム環境設定」の「ソフトウェア・アップデート」が表示されます。通知を閉じてしまった場合は……もし、通知を閉じてしまっても、「システム環境設定」...

2020.11.09 2020.11.10

ニッチな話題パソコン基礎知識

やっとLiteSpeed Cache 3.5.2がリリースされたので更新してみた【Javascript読込みの最適化設定】

やっとLiteSpeed Cache 3.5.2がリリースされたので更新してみた【Javascript読込みの最適化設定】

ここまでのあらすじを振り返ってみると、LiteSpeed Cache 3.5.0.1がリリースされたのが、2020年9月29日でした。その後、すぐに（2020年9月30日）JQueryの遅延読みで不具合が見つかり、LiteSpeed Cache 3.5.0.2として以前のバージョンにいったん戻されます。当初はすぐに修正される見通しでしたが、しばらく、そのままになっていました。最近ようやく動きがありましたので、メモしておきます。LiteSpeed Cacheの更新履歴を読んでみ...

2020.11.02 2020.11.05

ニッチな話題ホームページ運用

Javaをアップデートしようとしたら削除してしまった【更新とインストール】

Javaをアップデートしようとしたら削除してしまった【更新とインストール】

スマートフォンやパソコンを使っていると、いろいろなソフトウェアのアップデートを「さばく」、ということが大事だと感じます。今回、「アップデートしようとしたら、削除していた」という、ちょっと「不思議」な体験をしたので、メモしておきます。パソコンに慣れてても、そんなことがあるんだね要件macOS Catalina 10.15.7Java 8 Update 271 build 09"A new version of Java is available!"「Java 8 Update ...

ニッチな話題パソコン基礎知識

Macのデフォルトメールソフトの設定はどこ？

Macのデフォルトメールソフトの設定はどこ？

Macでメールアドレスをクリックした時に、Google ChromeのGmailが立ち上がっていました。メールを作成するのに「メール」アプリを使いたかったので、デフォルトのメールソフトを「メール」アプリに変更しました。システム環境設定にはメール設定はない最初、プロトコルの関連付けだと思ったので、「システム環境設定」内に項目がないか探したんですが、ありません。「メール」で検索してみたけれど…まずは「メール」アプリを起動する実は、「メール」アプリのメニュー「設定」にあります。「メ...

ニッチな話題パソコン基礎知識

Google Search Console でURL登録が一時的にできない！？【検索エンジンのアップデート】

Google Search Console でURL登録が一時的にできない！？【検索エンジンのアップデート】

Google Search ConsoleでURL登録をしようとしたら、エラーになってしまいました。はじめて経験したので、メモしておきます。【追記：2020年12月24日】復旧しました。「ページの操作が一時的に無効になっています。」Google Search Consoleで記事が検索対象になるように、URL検査をしたところ、「インデックス登録をリクエスト」がグレーになっていました。ページの操作が一時的に無効になっています。原因は「検索のアップデートための準備」オンラインサー...

2020.10.16 2020.12.23

インターネット小話ニッチな話題ホームページ運用

Google Search Consoleのスクリーンショットは公開してよいのか？

Google Search Consoleのスクリーンショットは公開してよいのか？

Google Search Consoleは、自分のサイトを登録して、検索パフォーマンスを集計するためのツールです。この集計されたデータは規約上公開してよいものなのか、確認してみました。結論としては、サイト管理者の許可があれば大丈夫とのことです。ネットに情報をアップするときに気をつけることデータを公開してよいのかの基準には、以下のようなものがあります。著作権・知的財産権プライバシー・肖像権機密情報・秘密保持義務例えば、Google Adsenseの場合は、利用規約に「秘密保...

2020.10.12 2020.10.14

インターネット小話ニッチな話題ホームページ運用

「国勢調査」の検索行動の推移【締切間際の偏り具合を調べた】

「国勢調査」の検索行動の推移【締切間際の偏り具合を調べた】

先日、スマートフォンから国勢調査のインターネット回答をし、レポートしました。そのレポートのアクセス数の変化をGoogleサーチコンソールでみてみると、予想以上にたくさんの人が、締切ギリギリに行動していたことがわかりました。けっこう締切ギリギリの人も多いんですね💡検索パフォーマンスのグラフ国勢調査の書類は、9月中旬ごろに書類が郵送されてきました。10月7日までにオンライン回答をすると、訪問調査がなしになる、ということだったので、実質的に、３週間ぐらいの調査期間でした。この間の検...

2020.10.12 2020.10.27

ちいラボエッセイインターネット小話ニッチな話題ホームページ運用

[Pinterest] RSS Feedがうまく生成されていない【WordPressのRSSを修正する】

[Pinterest] RSS Feedがうまく生成されていない【WordPressのRSSを修正する】

Pinterestとブログの連携をしていたら、エラーに遭遇したのでメモ書きです。※未解決です。PinterestでRSSを読み込めない（泣）Pinterestにウェブサイトを認証すると、「自動公開する」という選択肢が表示されるようになります。これができると、ブログに投稿すると、自動的にアイキャッチ画像でピンが作成されます。もし、サイトのRSSフィードのURLがわからない場合は、ここで調べられます。ところが、Pinterestにフィードを登録しようとしたら、エラーが出てきました...

2020.10.11 2022.02.28

ニッチな話題ホームページ運用追記予定の話

ウェブ集客のため（？）にPinterestに登録してみた話【ビジネス向けアカウント】

ウェブ集客のため（？）にPinterestに登録してみた話【ビジネス向けアカウント】

Twitterを見ていたら、「ブログのアクセスアップにPinterestが有効」という話題がありました。お店にとってPinterestは有効なのか？Pinterestについては、InstagramみたいなSNSという認識だったので、ちょっと試してみることにしました。へぇー。いろいろがんばるねぇPinterestとInstagramの違いをまとめようPinterestは写真を共有するサービスです。似たようなサービスで有名なInstagramと比較してみましょう。Pinteres...

2020.10.09 2024.04.18

SNSとりあえずのメモインターネット小話ニッチな話題ホームページ運用

「URLはGoogleに登録されていますが問題があります」？【AMP動画の必須属性】

「URLはGoogleに登録されていますが問題があります」？【AMP動画の必須属性】

Googleの検索にブログのURLを登録しようとしたら、こんなエラーに遭遇しました。動画を扱っているページだったので、動画のAMP対応をしました。「URLはGoogleに登録されていますが問題があります」とはブログ記事が出来上がって、Google Search Consoleで、URLをテストしました。インデックス登録の仕方と意味についてはこちら。すると、エラーメッセージが表示されました。URLはGoogleに登録されていますが問題がありますAMP AMPページが無効ですはい...

2020.10.08 2021.10.19

ニッチな話題ホームページ運用

「ループ」で問題解決をする？【ライトボットのプログラミング教育】

「ループ」で問題解決をする？【ライトボットのプログラミング教育】

プログラミングで重要な「ループ」という話をしてみたいと思います。「ループ」というのは、「繰り返し」のことです。ちなみに、前回はこちら。ちょっと問題を見てみましょう。「プロシージャー1 」の中で、「 P1 」コマンドを使って、「ループ」を作ることができます。先ほどのプロシージャにある、プログラムを入れる領域の中に、「 P1 」プロシージャ自身を呼び出すコマンドを入れることで、「繰り返し処理」にすることができます。「プロシージャ1 」の中で...

2020.10.05 2021.12.18

ニッチな話題パソコン基礎知識プログラミング

LiteSpeed Cacheプラグインが使えない場合があるのはなぜ？【レンタルサーバーの種類】

LiteSpeed Cacheプラグインが使えない場合があるのはなぜ？【レンタルサーバーの種類】

WordPressには有料・無料、さまざまなプラグイン・テーマがあります。LiteSpeed CacheプラグインもWordPressプラグインの一つですが、使える場合とそうでない場合があるということだったので、理由を調べてみました。キャッシュ化の仕組みわたしがLiteSpeed Cacheプラグインを知ったのは、「サイトの接続スピードをあげよう」という調べ物をしていたときです。サイトスピード向上には、いろいろな方法がありますが、そのうちの一つが「キャッシャ化」です。インター...

2020.10.02 2020.10.03

インターネット小話ニッチな話題ホームページ運用

LiteSpeed CacheがアップデートされてJQueryが遅延読込みされている【ただしサイトスピードは高速化】

LiteSpeed CacheがアップデートされてJQueryが遅延読込みされている【ただしサイトスピードは高速化】

ほとんどタイトルが全てなんですが、LiteSpeed Cacheプラグインのアップデートについてメモしておきます。プラグインのアップデート一つでこんなに変わるんですね。LiteSpeed Cacheのバージョンが3.5.0.1にアップグレードされたLiteSpeed CacheはWordPressのプラグインで、mixhostサーバーではサイトスピード向上のために利用することができます。最近（2020年9月29日）バージョンが3.4.2→から3.5にアップデートされました。そ...

2020.09.30 2023.07.07

ニッチな話題ホームページ運用

[Mac] サブフォルダ内のファイルを親フォルダに集める【フラット化のコマンド】

[Mac] サブフォルダ内のファイルを親フォルダに集める【フラット化のコマンド】

資料用の画像ファイルを、Mac内にフォルダ分けして管理していると、「似たようなフォルダに分かれてしまった中身を一箇所に集めたい」ということがけっこうあります。いちいちファイルをマウス操作で移動したり、不要になったフォルダを削除するのは大変で、ついつい後回しになってしまいます。そこで、今回はフォルダに小分けしすぎたファイルをまとめるコマンドラインを見ていきましょう。フォルダのフラット化下位フォルダのすべてのファイルを、一箇所のフォルダに移動する操作のことを、「ディレクトリ構...

2020.09.27 2022.04.10

ニッチな話題パソコン基礎知識プログラミング

[mixhost] 自分のサイトにアクセスできない【データベース接続確立エラー】

[mixhost] 自分のサイトにアクセスできない【データベース接続確立エラー】

ブログの編集をしていたら、いきなりアクセスできなくなりました。どうもレンタルサーバの一時的なエラーで、1時間ほど待つと無事に復旧されました。はじめてのことでびっくりしましたので、その顛末を記録しておきます。Error establishing a database connectionとは？自分のサイトにアクセスしたら、こんなメッセージが表示されました（2020-09-26 17:33）。Error establishing a database connectionThis...

2020.09.26 2023.03.28

#PR含むニッチな話題ホームページ運用

[Cocoon]外部ブログカードのサイトアイコンを上に移動した【CSSのposition:absolute】

[Cocoon]外部ブログカードのサイトアイコンを上に移動した【CSSのposition:absolute】

以前、funtions.phpでテンプレートを変更することで、ブログカードのデザインを変更しました。しかし、「デザインを変更するならCSS」ということで、改めて挑戦してみました。こんなふうに変えましたいつものようにビフォー・アフターをお見せします。↓こうなりました。HTML要素を変更せずにちゃんとCSSでデザインを変えられました。CSSコードはこちらポイントはblogcard-footer要素の位置をabsolute（絶対配置）にして、移動することです。親要素内に自由に配置で...

2020.09.26 2024.08.08

ニッチな話題ホームページ運用

[Cocoon] 引用ブロックをすっきりさせた

[Cocoon] 引用ブロックをすっきりさせた

引用ブロックのデザインをすっきりさせました。前後のデザインの比較もとはこんな感じでこうしました。引用符を枠線の外に出すことで、ちょっとすっきりしてませんか？CSSコードはこちら/** * 引用をすっきりさせた * */.entry-content blockquote:before, .entry-content blockquote:after { position: absolute; width: 0.5em; color: #a08010; background: w...

ニッチな話題ホームページ運用

[Cocoon]アイコンリストのデザインをラベルボックスみたく余白をつめた

[Cocoon]アイコンリストのデザインをラベルボックスみたく余白をつめた

Cocoonのアイコンリストのデザインが、ラベルボックスに比べて余白が多すぎる感じがしたので、修正しました。ビフォー・アフターを比べる元のデザインがこれでちょっとラベルボックスに比べると間延びしている気がします。こんなふうにしました。ほんとはさらにリストタイトルをラベルのようにしたかったんですが、ボーダーをつけるdiv要素を変えるのは大変だったので、やめました。Cocoonのラベルボックスのいいところ記事の中のポイントが目立って、読みやすいことです。Cocoonのアイコンリス...

ニッチな話題ホームページ運用

Macのシステムアップデートが進まないしょうもない理由【macOS Catalina 10.15.7アップデート】

Macのシステムアップデートが進まないしょうもない理由【macOS Catalina 10.15.7アップデート】

macOSのアップデートで何度も進まないことがありました。エラーメッセージはなかったのですが、どうも HDDの空き容量が十分になかったようです。更新データの分の空き容量だけでは、アップデートが途中で進まないことがあるんですね。アップデートの時は空き領域に余裕を持って、実行してみてください。macOS Big Surのアップデートはこちら。アップデートの通知がありましたMacのアップデートを促す、こんな画面が出てきました。ソフトウェア・アップデートこのMac用のアップデートがあ...

2020.09.26 2023.05.14

Macニッチな話題パソコン基礎知識

Skypeのビデオ通話画面（フリーイラスト）

Skypeのビデオ通話画面（フリーイラスト）

こちらはスライドのために作成した図案です。クリエイティブ・コモンズの素材をもとにしているので同様のライセンスで公開します。ご利用ください。Skypeのビデオ通話画面（フリーイラスト）この作品はクリエイティブ・コモンズ表示 - 継承 4.0 国際ライセンスの下に提供されています。画像利用元ビデオ会議オンラインセミナースカイプ - Pixabayの無料画像

2020.09.25 2022.09.13

ニッチな話題

スムーズにフリーイラストの配布する【ショートコードでクリエイティブコモンズ登録】

スムーズにフリーイラストの配布する【ショートコードでクリエイティブコモンズ登録】

こないだは自作の画像ファイルをクリエイティブ・コモンズ・ライセンスで公開する方法を調べました。せっかく作った図案のうち、再利用できそうなものは、ほかの方も使えるようにすると便利なはずです。しかし、ライセンス情報をHTMLで記述するのは大変です。そこで、ショートコードで省力化できないか、と考えました。それが今回のお題です。ショートコードで実現したい目標ショートコードは[cc_img url=画像のURL name=表示名]という書き方にします。つまり、こんなふうに入力したらこん...

2020.09.25 2021.10.19

インターネット小話ニッチな話題ホームページ運用

Amazon商品紹介リンクをショートコードで入れられるようにした

Amazon商品紹介リンクをショートコードで入れられるようにした

Cocoonには商品紹介のショートコードがあります。これまでは手動でAmazonアソシエイトツールバーでリンクを取得していたんですが、これがまぁ大変。ショートコードを利用するとISDNなどの商品コードだけで画像や商品名を表示することできることに気づきました。これまでのやり方は大変だった見出しやボタンを組み合わせて、作っていました。画像リンクやテキストリンクなどをコピーしてくるのに、かなり時間がかかります。それを、こんなふうにしました。見た目にもコンパクトだし、何よりも気軽に使...

2020.09.24 2024.08.31

#PR含むニッチな話題ホームページ運用

遅延読込みでコードハイライトが機能しない【LiteSpeed Cache】

遅延読込みでコードハイライトが機能しない【LiteSpeed Cache】

cocoonには「ソースコード設定」をしておいて「コードブロック」を挿入すると、コードをカラフルにハイライト表示する機能があります。なんか見た目にカラフルでいいですよね。cocoonでコードがハイライトしないところが何故かうまく表示されません。まずは、表示されたコードブロックを見てみてください。このように、コードブロックがあるのにjavascriptの色分けがされていません。まずはHTMLを検証してクラスを確認する検証でHTMLを見てみると、ちゃんとjavascriptのクラ...

2020.09.24 2023.04.23

ニッチな話題ホームページ運用

リンクを表示するとスタンプが押されるCSSアニメーション

リンクを表示するとスタンプが押されるCSSアニメーション

今回は「押すのが心地よいリンク」というのを考えてみました。それが、画面に表示すると、スタンプが押されるアニメーションです。枠の中にマウスをポイントしてみてください。どうでしょうか？　押したくなります？HTMLコードポイントは、my-stampとstamp2というクラスです。my-stampが枠全体、stamp2が中のイラストを指しています。<figure class="wp-block-image size-large is-resized my-stamp"> 読んだよ ...

2020.09.23 2024.12.16

ニッチな話題ホームページ運用

次のページ

1 2 3 4