子テーマ"Stinger-minimum"を新しくなった「STINGER5」用に作りなおしました。

カテゴリー:WordPress    |    タグ:

子テーマ"Stinger-minimum"を新しくなった「STINGER5」用に作りなおしました。

最近新しくリリースされた「STINGER5
html5でレスポンシブにされており内容も充実して更にパワーアップ!

そんな「STINGER5」用にあわせて、以前作成した子テーマ"Stinger-minimum"デザインを作りました。

informationこの記事でのカスタマイズバージョン:stinger5ver20140822

STINGER5版"Stinger-minimum"

わかりづらいかと思いますが今回、時間の都合によりデモではなく画像になっております(T_T)

出来上がりの図(PC版)

testWordPress

出来上がりの図(iPadサイズ)

testWordPress-t

出来上がりの図(スマホサイズ)

testWordPress-s

全体の大きさは1040px、メインコンテンツのところは710px、サイドは代えずに作成しています。
ですのでダブルレクタングルもできるようになっています。
画像については、コンテンツの中だけ装飾をしておりmax-width: 96%;に設定してあります。

使い方などについて

子テーマ導入についてなど、簡単ですがさくっとこちらに書いています。

ご注意して頂きたいこと

前に書きました、こちらのことが関連しています。

このカスタマイザーはデフォルト(初期状態)で、子テーマ"Stinger-minimum"のCSSを書いていますのでその点だけご留意ください。

これを作ったあとにカスタマイザーに気づいたのはナ・イ・ショな!

子テーマ"Stinger-minimum"ダウンロード

ダウンロードはこちらから

Stinger5-Child Stinger-minimum

さいごに

今回STINGER5のものより少しブレークポイントを増やしています。少しだけ元々"Stinger-minimum"のデザインと違うところがあります。また今回はじめてレスポンシブの子テーマというものをつくったのできっとおかしいところや、ん?と思うところがあるかと思います。
なにかお気づきの点があれば教えてくださいね!

細かなところなどたくさん省きましたが、子テーマ"Stinger-minimum"で楽しんでいただければ幸いです。

ADVERTISEMENT

  • Pocket
  • このエントリーをはてなブックマークに追加

published:2014/08/23    Written by:
カテゴリー:WordPress,      タグ:

最後まで読んでくれた方へ。

閲覧頂きありがとうございました!
お気に召しましたら是非RSS登録やフォローをお願いします!

Twitter

関連記事

Wordpress1

WordPressでカテゴリーごとにデザインを変更する方法【Stingerカスタマイズ】

表題についてお問い合わせを頂きましたので、ブログにてご返答させて頂こうと思います。 今回は、エント

記事を読む

ELLY95_hanatotegami

【Stinger3カスタマイズ】少し落ち着いたのでこのブログで変更したところを書き留めておく備忘録 #1

このブログは、Stinger3というテーマをもとにゴニョゴニョ…カスタマイズしています。今回はこ

記事を読む

Wordpress1

カスタムフィールドを使って記事下にまとめや今日の一言などいろいろと表示させてみよう!

前回このような記事 ブログの記事下に自分のプロフィールとRSS購読ボタンを設置する を書いたのですが

記事を読む

piyo

子テーマ「Stinger-minimum」の全貌を備忘録+CSS3のtext-shadow

子テーマ「Stinger-minimum」をリリースしてから早いくとせ。。経ちました最近ブログにお問

記事を読む

カスタマイザー-i

新しくパワーアップされた「STINGER5」のテーマカスタマイザーを使ってみよう!

最近新しくリリースされた「STINGER5」html5でレスポンシブにされており内容も充実して更にパ

記事を読む

コメントを残す

6件のコメント

  • 前原
    2014年9月9日 8:27 AM

    はじめまして 前原と申します。
    新しくなったStinger-minimumを使わせて頂いています。
    すっきりとした見やすいデザインがステキですね。

    お聞きしたいのですが
    記事内のリストul.olタグの文字を大きくするために

    /* 記事内の ul, ol タグ */.ol li {
    font-size: 16px;
    line-height: 25px;
    list-style-type: decimal;}

    .ul li {
    font-size: 16px;
    line-height: 25px;}

    .ul {
    list-style-type: disc;
    padding-top: 0px;
    padding-right: 20px;
    padding-bottom: 0px;
    padding-left: 40px;}

    上記を
    小テーマ側のstyle.cssの一番下に
    追加してみたのですが
    フォントサイズが変更できません。

    kizi.ol liで囲んでもダメでした。
    お時間が許すのであればご教授願いたいと思います。

  • niji_mami
    2014年9月9日 9:24 PM

    はじめまして 前原さん(o´∀`o)
    コメント&ご利用頂きありがとうございます。

    ul.olタグの文字を大きくしたいとのご質問ですが、
    cssに記載する
    ul,olの前に.(ドット)を書かないで

    ul li{
    font-size: 16px;
    line-height: 25px;
    }

    こんな感じにしてみてください!

    また何かありましたらお気軽にコメントくださいね|*゚∀`*)ノ

  • 前原
    2014年9月14日 1:03 AM

    丁寧なお答えありがとうございます。
    教わったとおりにやってみたのですが
    何故かフォントサイズ変更できなくて
    ぐぐったりいろいろしていました。
    覚えたてのCSSの知識ではムリみたいです。
    CSSを本格的に勉強してからまた挑戦してみます。

  • niji_mami
    2014年9月14日 10:10 PM

    前原さん こんにちは!

    そうですか。。できなかったですか。。残念です(`;ω;´)

    検証ができなくて大変申し訳ないのですが、親テーマのcssを見ると、【.post ul】 とクラス名にpostが使われているので、一度こちらでお試しください。( *゚ェ゚)*_ _))ペコり

    ちゃんと文字が大きくできるといいなぁ。。。
    また何かありましたらお気軽にどうぞですw

  • みゆ
    2015年5月10日 3:20 PM

    .post ul
    で文字サイズが変えられました。
    なかなか解説されているところがなくて苦労していましたが、助かりました!

  • niji_mami
    2015年5月11日 7:50 PM

    みゆさん 
    こんにちは( ´∀`)

    なんだか解決できたようでよかったです(∩´∀`)∩
    コメントありがとうございました!

2件のトラックバック

ADVERTISEMENT
nijisan

Written by niji_sansan

生まれ落ちた地は神戸。
鉄成分入ってるものに興味あり!
キイロイトリが好き!
感動すると「ほぅ」と言いますw

  • 2016年6月
    « 12月    
     12345
    6789101112
    13141516171819
    20212223242526
    27282930  
電子書籍ストア BookLive!
PAGE TOP ↑