またまたStinger3とWordPressのカスタマイズあれこで、だいぶしまったデザインへ

公開日: : 最終更新日:2017/10/18 ネットサービス/ブログ , ,

また、色々いじくってみた

★全体カラムの左右を入れ替え
STINGER3の本文記事とサイドバー(ウィジェット部分)の左右位置を入れ替えたり幅を調整したりする際のCSS設定 :

★画像に影と縁線つけ
画像に影をつけるワードプレスプラグインShadowsの使い方 | ネットビジネスで20代にて転職して独立したなるひこのブログ :

最初、これを読んでプラグインでがんばったんだけど、なんか変な線がとれなくてあきらめ。

結局CSS3でやったら、できたので、子テーマのCSSに下記のように書いて、img属性に全部縁と影をつけてみたら一番手軽だった。

[CSS]ボックスに影を付ける(ドロップシャドウ)CSS のプロパティ「box-shadow」 :

/* 画像に薄いグレーの縁と影をつける */
.post img {
border:solid 4px #eee;

box-shadow: 4px 4px 8px #666;
-webkit-box-shadow: 4px 4px 8px #666;
-moz-box-shadow: 4px 4px 8px #666;
}

AddQuicktagの設定方法と使い方動画。表示されない? | ネットビジネスで20代にて転職して独立したなるひこのブログ :

このプラグインで画像1つ1つにShadowsをつけるってのもあったんだけど、それはそれで面倒だよね。

でも、AddQuicktagは、いいプラグインなので

AddQuicktagプラグインでタグ挿入ボタンをPrinciple仕様に | 初心者にもおすすめ!無料 WordPress テーマ『Principle』 :

このjsonをインポートしたらかなり決まったタグをいれるときはいい感じです!

STINGER3デフォルトのデザインっぽさをなくすなら、まずカスタマイズしたいCSSセレクタ :

最後にこれで「続きを見る」ボタンをとってみた。

<結果>こんな風に画像がしまっていい感じです!

PS3購入&GT5開始記念サンプルランボルギーニ
countach

<TOPページデザイン変遷>
stinger3_1

stinger3_2

stinger3_3

a

関連記事

セゾンの永久不滅ポイントを等価交換で銀行に振り込む方法を発見した!

永久不滅ポイントってありますよね 永久不滅ポイントサイト |永久不滅.com(ドットコム) :

記事を読む

掛け値なしに、お世辞でなく、ビザスクはすごいサービスだと思った2016年。

気づけば色々お世話になっていたサービス「ビザスク」について、ここいらで1つ振り返ってみた。 去年中

記事を読む

男もすなるblogなるものを(初期契約と設定)

男もすなるblogなるものをWordpressとロリポップで開始 まずは、地ならし。 ○

記事を読む

(WordPressカスタマイズ)サイドバーのウィジェットが落ちるのを直してみた

サイドバーのウィジェットが、ある程度下の方へいくと突然消えて気持ち悪いのをなおしい衝動に駆られて調査

記事を読む

Windows10でGenymotionで音がでなくなったので諦めてBlueStacksに乗り換えたが、やや今ひとつだったら、NOXが最高だった

ただただ、Androidアプリの画面を動画で録画したくて 仕事で扱っているのはいわゆるスマホネ

記事を読む

世界一小さいAndroid端末 POSH Micro X S240b は、果たして実用に耐えうるのか?

結論から言うと 完全にテザリング端末として超割り切って使用する分にはなんとか使える。

記事を読む

気分転換に、LOGASTERで、適当にロゴを作ってみるテスト

なんとなく2年間ほったらかしだったので。ダサいロゴだったのを変更することに。 変更前

記事を読む

Stinger3カスタマイズ(マイ)ブーム再燃

気が向いたので、またStinger3をいじってみることにした。 どうやら子テーマというのを作成

記事を読む

単焦点のレンズが欲しいけど先立つモノが無いのでPIXTAをはじめてみた

せっかく先日買ったミラーレス一眼カメラ・・・ 小学1年生にあがった長女が生まれる前に買ったコン

記事を読む

WordPress4.0にVerUPしたくてバックアップしようとして色々ハマるの巻

WordPress 4.0 が利用可能です ! 更新してください。 と出たので気軽に更新しよう

記事を読む

a

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

a