本ブログは、GMOソリューションパートナーが運営する本社ブログです。 当社ブログ更新担当者により、社内の様子や、オーガニックなブラックコーヒーも無料と評判のカフェ(社員食堂)GMO YOURSのレポート、渋谷周辺グルメ情報などをざっくばらんに発信していきます!お仕事の合間・コーヒーブレイク時にでもお読みいただけますと幸いです!採用・求人にも力を入れておりますので、IT業界・営業のお仕事など内容に興味のある方は、今すぐこちらの採用情報の応募フォームからエントリー!

XeoryExtensionのメインビジュアルの高さ変更

0
    おはようございます。
    GMOソリューションパートナー本社ブログ担当です。

    本日は、いつもと趣向を変えてWordPressの人気テーマ「XeoryExtension」
    のメインビジュアルの高さ変更について書いてみます。
     
    Xeory Extensionは、デフォルトですとフロントページのメインビジュアルが非常に大きいです。

    インパクトがあるので、これはこれでかっこいいのですが、高さを変更したいと思うこともあるはずです。

    公式サンプルサイト:https://xeory.jp/extension/

    で、早速ですが、まずメインビジュアルの高さはどこで変えるかといいますと、「body.home #main_visual」で変えられます。
    body.home #main_visual {
    background: #41BAA4;
    background-image: -webkit-linear-gradient(bottom right, #41baa4, #42a994);
       background-image: linear-gradient(to top left, #41baa4, #42a994);
       color: #fff;
       text-align: center;
    }

    例えば、こんな感じです。
    【参考例】
    body.home #main_visual {
     background: #41BAA4;
     background-image: -webkit-linear-gradient(bottom right, #41baa4, #42a994);
       background-image: linear-gradient(to top left, #41baa4, #42a994);
       color: #fff;
       text-align: center;
     height: 200px !important;
    }

    もし、メインビジュアル内の文章の位置を上げたかったら、高さ変更の要領で「body.home .wrap」にmargin topを!importantを付けて設定して調整して下さい。

    本日は、ここまで。


     

    関連する記事

    Google+

    calendar

    S M T W T F S
       1234
    567891011
    12131415161718
    19202122232425
    262728293031 
    << March 2017 >>

    selected entries

    categories

    archives

    recommend

    links

    profile

    書いた記事数:257 最後に更新した日:2017/03/03

    search this site.

            

    others

    mobile

    qrcode

    powered

    無料ブログ作成サービス JUGEM