webに関するアレコレ
wordpressの初期設定としてメディアサイズをいくつか自動で設定してくれる機能があります。
それは管理画面の設定→メディアよりサイズを変更することが可能です。
全てを0にすることです。
大抵の場合はここで終わりですが、それともう一つ設定する場所があります。
http://あなたのドメイン/wp-admin/options.php
ここで768pxの画像を用意するように設定してあるので、この数字を0にして終了です。
結構スクロールするので「medium_large_size_w」と検索をかけたほうがいいかもです。
地味によく使うのでメモ。
.kadomaru {
-webkit-border-radius: 5px;/* for Safari and Chrome */
-moz-border-radius: 5px; /* for Firefox */
-o-border-radius: 5px; /* for opera */
border-radius: 5px;
}
Safari・Chrome・Firefox・operaに対応（IEは11から対応）
http://caniuse.com/#search=border-radius
スマホサイトなどレスポンシブサイトでよく使うのでメモです。
縦横比は保持して、背景領域に収まる最大サイズになるように背景画像を拡大縮小する
縦横比は保持して、背景領域を完全に覆う最小サイズになるように背景画像を拡大縮小する
サーバーコントロールパネルの管理画面にログインして新規ドメイン追加します。
サーバーコントロールパネルURL：https://secure.sakura.ad.jp/rscontrol/
ちなみにこの後ドメイン一覧で追加されたことを確認して、サブドメインの詳細設定を変更しました＾＾
基本的にwordpressで500エラーが起こったときは管理画面に入ってプラグインを無効化して一つ一つ有効化して様子みたりするのですが、今回は管理画面もログイン出来ない全体的な500エラーでした。
もしかして.htaccessが影響しているのかも？と思って確認してみても違う様子･･･。
こんな時こそサーバー側で取ってあるエラーログで原因を確認してみました。
管理画面にログインして該当サイトのTOP→エラーログへ。
エラーログをダウンロードします。
中身を見てみると直近の日時に次のような文章が。
[Sat May 26 22:41:48 2018] [warn] [client 66.249.79.81] mod_fcgid: stderr: PHP Parse error: syntax error, unexpected T_FUNCTION in /home/サイトフォルダ名/サイト名/public_html/cms/wp-content/plugins/wordpress-popular-posts/includes/class-wordpress-popular-posts-rest-controller.php on line 374
これは「WordPress Popular Posts」のプラグインに文章エラーが出てることを指しているので、FFFTPで該当プラグインのフォルダ名を変えて停止させました。
結果、再度サイトを更新してみるとピタッと500エラーが止まり、管理画面にログイン出来ました。
サーバーのエラーログのチェックが原因究明への近道でした。
PCサイトをスマホで見てみた時に背景が見切れてる時があります。
そのときの対処方法を書きたいと思います。
そのサイトで一番長いwidthサイズを確認し、そのサイズをbodyタグにmin-widthに書き込めばOK。簡単でした。
body {
font-family: “ヒラギノ角ゴ Pro W3”, “Hiragino Kaku Gothic Pro”, Meiryo, “メイリオ”, “ＭＳ Ｐゴシック”, Verdana, Geneva, Arial, Helvetica;
font-size: 92%;
line-height:150%;
margin:0;
padding:0;
color:#111;
min-width:1061px;
}
コピペするだけでtableの装飾が出来るように置いておきます。
th部分だけ背景色がグレーです。
.table01 {
border-collapse: collapse;
margin-bottom:20px;
width:100%;
}
.table01 th,.table01 td {
padding: 10px;
border: 1px solid #ccc;
}
.table01 th {
font-weight: bold;
background:#ecebea;
}
よくcommon.cssで使うmarginとpaddingのCSS箇所です。
/* margin-bottom */
.mb10 {margin-bottom: 10px;}
.mb15 {margin-bottom: 15px;}
.mb20 {margin-bottom: 20px;}
.mb25 {margin-bottom: 25px;}
.mb30 {margin-bottom: 30px;}
.mb35 {margin-bottom: 35px;}
.mb40 {margin-bottom: 40px;}
.mb45 {margin-bottom: 45px;}
.mb50 {margin-bottom: 50px;}
/* padding-bottom */
.pb10 {padding-bottom: 10px;}
.pb15 {padding-bottom: 15px;}
.pb20 {padding-bottom: 20px;}
.pb25 {padding-bottom: 25px;}
.pb30 {padding-bottom: 30px;}
.pb35 {padding-bottom: 35px;}
.pb40 {padding-bottom: 40px;}
.pb45 {padding-bottom: 45px;}
.pb50 {padding-bottom: 50px;}
CSSで装飾するときに同じ効果を表示できるタグがあるのですがどっちがいいのかという話。
調べてみたところ「text-decoration:underlineがいい」ということが分かりました。
理由はfontの種類（主にメイリオの場合）によってborder-bottomは変な余白が出てしまうためということでした。
下線に関してはtext-decoration:underlineは万能！ということで！
<ul class=”arrow”>
<li><a href=”#”>事務所のご案内</a></li>
<li><a href=”#”>行政書士プロフィールはこちら</a></li>
</ul>
.arrow li {
position: relative;
display: inline-block;
padding-left: 12px;
}
.arrow li:before {
content: ”;
width: 0;
height: 0;
border: solid 4px transparent;
border-left: solid 5px #014eb4;
position: absolute;
top: 50%;
left: 0;
margin-top: -4px;
}
