インターネット小話

WP ULikeプラグインがAMPページでうまく表示されない [WordPress] ニッチな話題

WP ULikeプラグインがAMPページでうまく表示されない [WordPress]

WP ULikeプラグインは、WordPressに「いいね」ボタンを設置するプラグインです。通常ページではこのようにハートマークのいいねボタンが表示されます。ところが、AMPページだと……0の隣の小さな白い丸になってしまっています。このハートマークは、CSSの:after 擬似クラスで背景画像として表示されています。ところが、AMPページでは:after擬似クラスが使えないため、何も表示されていないのです。いったんWP ULikeプラグインは無効にしました。残念。こちらもどう...
2020.09.17 2021.10.24
ニッチな話題ホームページ運用
WordPressで効率的にブロックを挿入したい！ 【スラッシュ挿入を活用】 （Change Block Keywordsプラグイン） ホームページ運用

WordPressで効率的にブロックを挿入したい！ 【スラッシュ挿入を活用】 （Change Block Keywordsプラグイン）

WordPressのブロックエディタには、スラッシュでブロックを挿入する機能があります。これを「slash inserter（スラッシュ挿入）」といいます。「slash inserter」で検索すると、英語の記事がいくつか出てきます。「change-block-keywords」プラグインを使うと、スラッシュ挿入のキーワードを自分で設定できるようになります。追記：2024-04-26ChangeBlockKeywordsプラグインのメンテナンスは、2021年5月を最後に止まっ...
2020.09.17 2024.08.08
ホームページ運用作業効率化
「:not()」で複数のclassを指定するには 〜 擬似クラス[CSS] ニッチな話題

「:not()」で複数のclassを指定するには 〜 擬似クラス[CSS]

プログラミングには論理演算というのがあって、条件を組み合わせることがよくあります。条件を組み合わせたい（論理積）ことは多い例えば、擬似コードですが、if(day ≠ "日" ∧ day ≠ "土") return 営業else return 休日このような２つの条件、Aでもなく、Bでもない、という書き方をすることがあります。CSSではどうすればよいのでしょうか？否定擬似クラス:notを組み合わせる否定擬似クラス:notがありますが、複数組み合わせる場合は実はつなげて書きます。...
2020.09.17 2024.06.12
ニッチな話題ホームページ運用
「NHKゴガク」アプリでテレビ講座は見られる？ （NHKをインターネットで見る方法まとめ） インターネット小話

「NHKゴガク」アプリでテレビ講座は見られる？ （NHKをインターネットで見る方法まとめ）

NHKの語学アプリをインストールしてみたんだけど、ラジオの語学講座は聴けるけど、テレビの講座が見られない！？どうして？残念ですが「NHKゴガク」アプリにはテレビ番組はありませんできることを見てみましょう。「NHKゴガク」アプリのできることNHKラジオ第２の語学番組が聞ける英単語クイズ発音練習サービス自分で調べるには「このアプリについて」を読んで見るこれはどうやって調べるかというと、アプリストアをよく見てみます。例えば、Playストアですと、「このアプリについて」という説明があ...
2020.09.17 2023.06.15
インターネット小話スマホ基礎
[PWA] 「ホーム画面に追加」という通知とは？（インストール不要のウェブアプリ） とりあえずのメモ

[PWA] 「ホーム画面に追加」という通知とは？（インストール不要のウェブアプリ）

「プログレッシブウェブアプリ（PWA）」は、スマートフォン上でアプリのように動作するウェブサイトです。PWAはホーム画面に追加でき、ブラウザのUI要素を隠すことでアプリのように見せることができます。PWAの目的は、ユーザーに頻繁にウェブサイトを訪れてもらえるようにすることです。プログレッシブなウェブアプリ？（PWA）インターネットを見ていると「ホーム画面に ちいラボアプリ を追加」などのようなメッセージが表示されることがあります。今回は、「PWA」というキーワードで、ホームペ...
2020.09.16 2024.06.29
とりあえずのメモインターネット小話スマホ基礎
WordPressのログイン画面にパスワードを入れても進まない ～WordPressアプリ・Jetpack ホームページ運用

WordPressのログイン画面にパスワードを入れても進まない ～WordPressアプリ・Jetpack

スマホでブログを書こうと思って、WordPressアプリをインストールしました。ところが、WordPressアプリと連携したら、なぜか通常のブラウザからのログインができなくなってしまいました。WordPressアプリログイン画面でパスワードを入力しても、ぐるぐるまわって先に進みません。後でわかったのですが、どうもロボットチェックの表示でひっかかかっていたようです。思い当たることといえば、WordPressアプリ。WordPress.comWordPressアプリは、WordP...
2020.09.16 2020.09.21
ホームページ運用
AMPエラー HTML タグに必須属性がありません。- formとJavaScript ニッチな話題

AMPエラー HTML タグに必須属性がありません。- formとJavaScript

ブログ記事の中にフォームを入れていたら、AMPエラーになりました。カスタムHTMLを使うとよくAMPエラーになりますね。足りなかったのは、formタグのtarget属性でした。formタグの説明では特に見かけなかったんですが、必須属性なんですね。今回のコードでは、javascriptの関数を動作させるためのボタンを配置するためにフォームを作りました。特にデータをサーバーに送るものでもなかったので、formのプロパティを指定していなかったのが、よくなかったようです。こちらが参考...
2020.09.16 2021.10.24
ニッチな話題ホームページ運用
CSSのクラス指定の空白の意味 知っていますか？子孫結合子と除外の方法 ニッチな話題

CSSのクラス指定の空白の意味 知っていますか？子孫結合子と除外の方法

CSSのクラス指定が複雑になったときの意味を調べてみました。散々、迷って出来上がったCSSのコードは以下です。.article :not(div.toc-content) li { font-size: 115%; font-weight: 600;}意図としては、「記事（.articleクラス）の中のリスト項目のフォントサイズを大きくする、ただし、目次（toc-contentクラス）のリスト項目のフォントサイズは大きくしない」です。これは3つの要素が組み合わせてあります。....
2020.09.16 2020.09.21
ニッチな話題ホームページ運用
デジタル通帳アプリのはじめ方とセキュリティ 【滋賀銀行を例に】 インターネット小話

デジタル通帳アプリのはじめ方とセキュリティ 【滋賀銀行を例に】

ATM に通帳を確認しようと思うと、平日に時間を取らないといけませんよね。相手から振込みをしてもらったかなど、すぐに確認したい取引もあって、「通帳アプリ」を利用しています。紙の通帳もなくなっていくようですし、デジタル通帳の使い方を確認してみたいと思います。 通帳アプリの３つの機能私の使っている通帳アプリ（滋賀銀行と京都信用金庫）には、こんな３つの機能があって、画面下のタブで切替えます。【ホーム】通帳記入を確認できる【お金管理】家計簿として入力したり、集計したりできる【サービス...
2020.09.15 2023.07.06
インターネット小話スマホ基礎セキュリティ
[Cocoon]ブログカードの表示順を変更してみる【functions.phpに追加する方法】 ニッチな話題

[Cocoon]ブログカードの表示順を変更してみる【functions.phpに追加する方法】

Cocoonテーマのブログカードをはてなブログ風のデザインに変更する方法を紹介します。functions.phpファイル内のurl_to_internal_blogcard_tag関数を修正して、ブログカードの要素の表示順を変更します。ブログロゴを上部に移動させ、CSSで抜粋のフォントサイズなどを調整することで、目的のデザインを実現できます。
2020.09.15 2024.08.08
ニッチな話題ホームページ運用
ブログの絵文字のサイズを小さくした【CSSのクラス指定】 ホームページ運用

ブログの絵文字のサイズを小さくした【CSSのクラス指定】

教室のブログを見ていたら、気になる点が……わかりますか？絵文字の部分が不自然に大きいんです。しかも、灰色の枠までついている。ということで、CSSをちょっといじります。デベロッパーツールでCSSを確認するChromeのデベロッパーツールで検証してみると、「.iwe-border-bold img」に該当するようです。絵文字ですが、インライン画像の挿入になっているんですね。ということで、文章中の画像には境界線が表示されないようにする必要があります。ところが、この「.iwe-bor...
2020.09.14 2022.03.27
ホームページ運用
目で見てわかる、こんな暗証番号がよく使われている 【危険な暗証番号のパターン】 インターネット小話

目で見てわかる、こんな暗証番号がよく使われている 【危険な暗証番号のパターン】

暗証番号に誕生日や生年を使用する人が多いことは、研究でも明らかです。特徴的な数字や2桁の繰り返しパターンも頻繁に使用されており、セキュリティリスクが高いです。安全性を高めるには、ランダムな数字を選ぶことが推奨されます。4桁の時点で何回も挑戦できたら、いずれはわかってしまうよね。まぁ、4桁のPINコードを採用するシステムでは、何度か失敗したら次の試行まで時間が空けられることも多いので、そうそう総当たり攻撃はできないはずですが。11人に1人が誕生日を暗証番号にしている？暗証番号に...
2020.09.14 2024.08.13
インターネット小話ニッチな話題
ブログをnote風のデザインにしてみた（ワンカラムデザイン） ホームページ運用

ブログをnote風のデザインにしてみた（ワンカラムデザイン）

今回はCocoonとCSSを使って、note風のシンプルなブログデザインに変更してみました。note風デザインの記事一覧「note（ノート）」というブログサービスをご存知ですか？ブログサービスといえば、ヤフーブログ、アメブロ、はてなブログといろいろありますが、noteの特徴は簡単にいえば、投稿されたブログにカンパしたり、有料記事として公開することができること。でも、それ以上にnoteの特徴になっているのは、シンプルなデザインだと思います。２カラムのアメブロと比べてみますと…パ...
2020.09.12 2024.08.29
ホームページ運用
とりあえず今の追加CSSをバックアップしておく（2020年9月11日現在） ニッチな話題

とりあえず今の追加CSSをバックアップしておく（2020年9月11日現在）

いろいろスタイルを設定したので、ここまでの「追加CSS」の中身をここにメモしておきます。それぞれの機能について、ブログで説明しているページがあればリンクも貼っておきます。ブログのデザインを練り上げている過程が全部わかる！改めてみるとコードの重複があったりするので、ちょっと整理したほうが良さそうですね。追加CSS全体（2020年9月11日現在）長いのでこちら/*** 印刷時のフォント*/@media print { p { font-family: 'Noto Serif JP...
2020.09.11 2024.08.08
ニッチな話題ホームページ運用
自分のイラストをgoogleの画像検索のクリエイティブ・コモンズに表示させるには ニッチな話題

自分のイラストをgoogleの画像検索のクリエイティブ・コモンズに表示させるには

画像検索の「クリエイティブ・コモンズ」の結果ってあんまりパッとしないよね！（失礼）Googleの画像検索はとても便利ですが、検索されたイラストを利用するためにはライセンスを確認する必要があります。画像検索ではライセンスによる絞り込みができるのですが、画像の数が少ないからか、検索キーワードに関係ない画像ばかりが表示されるのが現状です。逆にいうと、ここはまだブルーオーシャンで、もし有用な画像素材を登録すればひと目につくのではないか、と考えました。さて、いったいどうすれば、「クリエ...
2020.09.10 2020.09.23
ニッチな話題ホームページ運用
CocoonのSNSフォローボタンが大きかったので小さくした（border-radius）[CSS] ホームページ運用

CocoonのSNSフォローボタンが大きかったので小さくした（border-radius）[CSS]

ちいラボのブログ メンテナンス日記！今日は「フォローボタン」のデザインをおしゃれにしてみました。メモしておきます。環境WordPress 5.5.1 (Cocoon テーマ バージョン: 2.2.3.1)「SNSフォロー」ボタンを見つけたホームページのメンテナンスをしながら「Cocoon設定」を見ていたら、「SNSフォロー」ボタンがありました。さっそく表示させてみたところ、スマホでみると３行とだいぶ「目立ちすぎる」感じです。フォローボタンが５つもあると、ちょっと圧迫感がありま...
2020.09.09 2022.02.24
ホームページ運用
ないものは作ってみる、ちいラボで作った公開イラスト（クリエイティブ・コモンズ） インターネット小話

ないものは作ってみる、ちいラボで作った公開イラスト（クリエイティブ・コモンズ）

インターネットでフリーイラストを探して、なかったのでクリエイティブ・コモンズライセンスで公開します。ご自由にお使いください。銀行の確認番号表 銀行の確認番号表イラスト この 作品 は クリエイティブ・コモンズ 表示 - 継承 4.0 国際 ライセンスの下に提供されています。銀行のワンタイムパスワード生成器銀行のワンタイムパスワード生成器のフリーイラスト この 作品 は クリエイティブ・コモンズ 表示 - 継承 4.0 国際 ライセンスの下に提供されています。Keynoteの図...
2020.09.09 2020.09.25
インターネット小話ニッチな話題ホームページ運用
「ドコモ口座」のセキュリティと個人で注意できること 【リバースブルートフォースアタック】 インターネット小話

「ドコモ口座」のセキュリティと個人で注意できること 【リバースブルートフォースアタック】

新聞で見たんだけど、やっぱりネット銀行って危ないのかな？今回は、ネット銀行と決済サービス（ドコモ口座）の連携の仕組みを勉強して、個人で注意できることを考えてみましょう。報道によると…（2020年9月9日）勝手に銀行のお金がおろされてしまうなんて怖いなあ。「ドコモ口座」をやめた方がいいのかな。確かに怖いですよね。でも、利用者が「ドコモ口座」をすぐにやめる必要があるかというと、実はそう単純でもありません。「ドコモ口座」を作っていなかった人でも被害にあっているからです。えっ？　被害...
2020.09.09 2021.10.04
インターネット小話
クレジットカードの不正利用に気づくには？ 【クレジット明細アプリとセキュリティ】 インターネット小話

クレジットカードの不正利用に気づくには？ 【クレジット明細アプリとセキュリティ】

クレジットカードって怖いよねクレジットカードで一番怖いのは不正利用ですよね。ニュースで不正利用事件について見て、クレジット明細アプリの使い方は大切だなぁと思ったので、ご紹介します。利用明細がわかるのが早ければ、詐欺被害は防げるクレジットカード決済の場合、約１ヶ月後にまとめて明細が届くので、知らないうちに悪用されて高額の請求が来るのが心配です。この「知らないうちに悪用される」というのがポイント。逆に言うと、すぐに不正利用が確認できれば、被害を防ぐことができるんですよね。スマホに...
2020.09.08 2020.10.07
インターネット小話
チャットアプリ「WhatsApp」で見つかった６つのセキュリティの問題から考える（2020年9月） インターネット小話

チャットアプリ「WhatsApp」で見つかった６つのセキュリティの問題から考える（2020年9月）

世界最大のチャットアプリ「WhatsApp」に、新しく6つの脆弱性（バグとセキュリティの問題に）が見つかったそうです。今回は、チャットアプリのセキュリティの問題を通して、アップデートの意味について考えてみましょう。WhatsAppとは？WhatsAppは世界最大のチャットアプリです。どうやってセキュリティホールは見つかったの？今回のセキュリティの問題は、４つは定期的にプログラムを点検するときに自動システムが発見しました。残りの２つはWhatsApp社のバグ報奨金プログラムで報...
2020.09.06
インターネット小話
次のページ