超・参考になった外部サイトさん一覧 ~プログラム/コード編~

『超・参考になった外部サイトさん』のリンク一覧です。

※サムネイルやコメントを付けて一覧表示させられるという理由から、お気に入り登録ではなく、この1ページにまとめてみました。

Jqueryが動かなくなった!

僕の場合、サーバー移管時、それまで問題無く動いていたfadeinが動かなくなりました。

そこで下記ページの『jQueryが正しく読み込めていない』の項を試すと、すぐに復活しました。

※問題が発生したサイトの場合、ローカルから読み込んでいたわけでは無いのですが、jqueryのリンク(バージョン)が古すぎたのかもしれません。

jQueryが動かない原因と対処法をご紹介!
WEBサイトにjQueryを設定して、いざ使うと思った時に参考にして下さい。jQueryが動かない原因の切り分け方や対処法を紹介しています。

スターレーティングの★★★★★をHTMLとCSSで描く方法

初め、<p>タグ内にinline-blockで書いたカラーの星★★★★★を黒の星★★★★★の上に重ねる方法を試してみた(主流なのかネット上では殆どこの方法が紹介されていた)。その場合(PC画面では綺麗に表示されるものの)スマホで見るとカラーの星★★★★★の全体幅が狭くなったりして、どうしても上手くいかなかった。

そこで、もっと良い方法がないか探していて上記サイトさの情報を発見。すごく簡単で、上手く表示された。

爆速でページをインデックスさせる方法

https://blog.give-shot.com/indexing-api/

2021年の後半あたりから、Googleの動きがこれまで以上に活発になった気がします。

タイトルの【 】や!、重複文字などが勝手に削除されたり、AIOSEOの設定が反映されなかったり・・・。『なかなかインデックスされない』などもその1つ。

しかしこの方法で、一ヶ月以上インデクスされなかった4,5記事が、すべて数日以内にインデックスされた!

ブログにSNSのシェアボタンを設置する ”超” 簡単な方法

簡単!WordPressサイトにSNSシェアボタンを追加する方法 | Web Design Trends
WebサイトはSEO対策も重要ですが、SNSを活用したマーケティングも非常に重要です。 特にメディアやブログなどは、投稿にSNSシェアボタンを設置することにより、SNSからのアクセスアップを増やすこと...

これまで色々な方法で(プラグイン意外の)SNSシェアボタン設置方法を試しましたが、上記ページの方法が一番簡単且つ、綺麗に設置できました。

WordPressのナビゲーションメニュー大(親)カテゴリーのリンクが効かない場合の対処法

aリンクタグが効かない時の対処法(javascriptが怪しい)
aタグのリンクが効かない場合の対処法をご紹介しています。他に考えられる原因が見つからない場合は、javascriptを疑ってみましょう。共同開発時や他人の作ったテンプレートを改変する場合はjavascriptを修正する事で解決する場合が多いです。

僕の場合は、オリジナルテーマのモバイル・ハンバーガーメニューの場合のみでしたが、それでも不便・・・。てっきりCSSの問題かと思っていたら、JavaScriptの問題だったんですね。

上記ページの内容を参考に『navigation.js』というファイルを下記のように編集したら無事解決した。

if ( event.type === ‘touchstart’ ) {
const menuItem = this.parentNode;
event.preventDefault();

👇

if ( event.type === ‘touchstart’ ) {
const menuItem = this.parentNode;
//event.preventDefault();

埋め込みGoogleカレンダー 背景も予定もCSSで色を変える方法

まずは下記ページの方法で複数の(違う色の)カレンダーを統合。CSSで背景色をカスタマイズ

Googleカレンダー(埋め込み)を好きな色・デザインにカスタマイズする方法 | 名古屋のホームページ制作会社・ゴリラウェブ
Googleカレンダーを全く違うデザインにカスタマイズする方法です。

次に下記ページを参考に(JavaScriptのコード)で、WEBサイトに埋め込んだカレンダーの予定の色を変える。

【FullCalendar】GoogleCalendarの同期について - Qiita
kotaziです。FullCalendarのGoogleCalendar同期について。Google CalendarGoogle CalendarFullCalendarではGoogle C…

ピンバック承認とは。いる?いらない?

ピンバックとは?正しい意味とWordPressに設定する方法
ピンバックは、参考にした記事のサイト管理者に「リンクを貼りましたよ」と通知して、あなたのサイトの存在を知ってもらえる。また、サイト管理者がこのピンバックを承認してあなたの記事リンクが表示されると、そのリンクからのアクセスが期待できる。 小さ

target=”_blank” や rel=”noopener”の正しい使い方

CSSの(テキスト縦・横)中央揃え

CSSで中央寄せする9つの方法(縦・横にセンタリング)
【図解】HTML&CSSで縦・横・ど真ん中にセンタリングする方法を総まとめしました。また「中央寄せできない」というときの対処法も一覧にしています。

PHPの改行

PHPでの改行方法(ブラウザとソース表示)と改行できない場合の対処法
PHPの改行。ブラウザで改行してもソースでは改行されない、改行文字が反映しない…そんな場合の解決法、HTML改行タグを入れてくれる nl2br関数も紹介します。

リンク選択範囲を文字から枠内に広げる方法

リンク反応範囲の拡張

jQueryを埋め込みコードやダウンロードで利用する方法

jQuery - OpenSquareJP|井上貢一研究室
九州産業大学 芸術学部 ソーシャルデザイン学科 情報デザイン研究室

毎回迷うポイントとして忘れてはいけないのが、上記ページに明記されている下記の引用部分。

jQuery本体は、jquery-3.5.1.js のような名前のファイルとして提供されています。ふつうのテキストファイルなので、ダウンロードをクリックすると、ソースコードがそのまま表示されます。右クリック>「リンク先を保存」 でDL保存して下さい。

jqueryの公式サイトで公開されているダウンロードファイルは、前述の通り『テキストファイル』。

ソースコードなので、これを .js 形式で保存する必要がある。

また、jsファイルの保存場所にも注意。

jqueryを動作させたいファイル(index.phpやsingle.php等)と同フォルダ内に保存すればよいかと思いがちだが、実はこれでは稼働しない場合がほとんど。

(デフォルトで保存されている)他のjsファイルの保存場所に習い、同フォルダに保存する必要がある。

例:/hisshiweb/blog-posts/wp-includes/js/○○○min.js

Hosted Libraries  |  Google for Developers
Get a list of the libraries included in this Google-hosted content distribution network for popular, open source JavaScript libraries.
タイトルとURLをコピーしました