WEB制作で発生した問題と解決法メモと参考にしたサイト
Photoshopの初期設定
四角形画像をカード型に角丸で切り抜く(Photoshopのクリッピングマスク)
htaccessに追記するhttp→httpsへの301リダイレクト設定方法
HTTPコードチェッカー
https://singoro.net/http-status-code/
このサイトのhttp→httpsへの301リダイレクトの設定で使用しました。
https://digital-life.club/hp/redirection-to-https-for-lolipop
ロリポップ×ワードプレスでのやり方
HTMLはさわらず、CSSだけで要素の表示順を変更する方法
https://www.j-cool.co.jp/blog/?p=7039
スマホページで表示順を上下で入れ替える際に使いました。
いままではスマホとPCでdisplay:none; とblockで場所切り替えしてたのがバカらしくなるくらい便利。
CSSでここまで出来ると非常に助かります。
初めてのBASIC認証で役立ったサイト
http://www.luft.co.jp/cgi/htpasswd.php
はじめて設定する際に参考になったサイト。
パスワードの暗号化もサイト内で行えます。
htaccessを設置しただけで500エラーになってしまい、どうすればいいかわらずたどり着いたサイト。
サーバー内のフルパスが間違っていたことがこの記事で判明。
<?php
echo
__FILE__
;
?>
(うちの会社のサーバーのFTPからは見つけられないディレクトリがあったので)
サイトマップを複数設置し管理する方法
http://piyopiyocs.blog115.fc2.com/blog-entry-1097.html
これは本当に面倒でした。情報が少なく、こちらのサイトに助けられました。
当サイト、ワードプレスのプラグイン「google xml sitemaps」だけでずっと運用していたのですが、ワードプレスで作ってない普通のwebサイトをルート直下にフォルダ作ってFTPであげていたのですが(例えばhttps://kwsm.asia/color/)、プラグインのgoogle xml sitemapsにはこれらのページが書き込まれていなかったのです。
ということで、ワードプレスで自動作成されないサイトのサイトマップをsitemap2.xmlとし、プラグインのサイトマップはsitemap.xml(この名前で自動作成される)なので、この2つをrobots.txt(新たに作る)に下記のように書き込み、ここに関しては問題解決。
User-agent: * Disallow: /wp-admin/ Allow: /wp-admin/admin-ajax.php Sitemap: http://example.com/sitemap.xml Sitemap: http://example.com/sitemap2.xml
重複したワードプレスで作ったページの記述はsitemap2.xmlから削除して調整。
サーチコンソールでrobots.txtを更新し、googleに送信。
これで作業終了。
子テーマのfunctions.phpにはphpの閉じタグ書いちゃダメ
https://thesaibase.com/php/end-tag
このサイトのテーマを新しくし、子テーマ作成。
そしてそのfunctions.phpにh2タグ直前にアドセンス貼るコードを書いたのですが、むちゃくちゃなことに。
何が原因かわからず、3時間格闘し、やっとわかったのが、PHPの閉じタグ。
<?php
add_action(
'wp_enqueue_scripts'
,
'theme_enqueue_styles'
);
function
theme_enqueue_styles() {
wp_enqueue_style(
'parent-style'
, get_template_directory_uri() .
'/style.css'
);
wp_enqueue_style(
'child-style'
,
get_stylesheet_directory_uri() .
'/style.css'
,
array
(
'parent-style'
)
);
}
ディレクトリ構造維持してファイル抽出できる超便利windows用フリーソフト
floatの解除にoverflow:hidden;使うとはみ出だしたい領域が隠れてしまう
overflow:hidden;のせいでhoverエフェクトでメニューが表示されなくなった。
.clearfix:after{ content: ""; clear: both; display: block; }
JQueryが動かない場合の解決策
colorboxを使ってinlineのhtmlをクリックでオーバーレイ表示したいのですが、
全然動かない。
原因はJQueryの「$」を再定義ができていなかったこと、
そして、scriptのinlineをiframeと書いてしまっていたこと。が原因でした。
Uncaught TypeError: $ is not a function というエラーが出ました。
このページで再定義をすることでJQueryが動き出しました。
あとはcolorboxのinlineが表示されるために、inline:trueに変更すればok