[WordPress] テーマ・カスタマイズ – Twenty Seventyテーマの2カラム表示の幅の拡大 – ID1775 [2019/09/03]
スポンサーリンク
by Google Ads ID23293 by Google Ads ID24747 by Google Ads ID:11145
by Google Ads ID8603
はじめに スポンサーリンク
【国内正規品】 DJI POCKET 2 Creator コンボ 黒 by Amazon ID25883 SanDisk ( サンディスク ) 128GB microSD Extreme PRO microSDXC A2 SDS QXCY-128G-GN6MA [ 海外パッケージ品 ] ,by Amazon ID26153
WordPress でblogを始めた頃は、先人の投稿を参考にしテーマを「Twenty Seventy」にしていました。2020/08現在は、WordPressのバージョンアップととにも搭載されたシングル・カラムであるTwenty Twentyに変更しています。
以下の記事は、Twenty Seventyの表示の体裁について、CSSもよく分からないまま、先人の知恵をお借りしてなんとか設定していた頃の記録です(2020/08/25, Mr.Harikiri)
by Google Ads ID8603 スポンサーリンク
Synology DS517 by Amazon ID:22173 Synology DS920+ by Amazon ID:22172 オムロン BY50S用パック by Amazon ID:22171 オムロン BY50S by Amazon ID22170 Synology 高機能無線ルーター VPN Plus対応 日本正規代理店アスク サポート対応 保証2年 NT934 RT2600ac by Amazon ID24327 エレコム LANケーブル CAT6A 5m 爪折れ防止コネクタ ホワイト LD-GPA/WH5 by Amazon ID24327 Twenty Seventyテーマの2カラム化 スポンサーリンク
by Rakuten ID:15895 以前、使っていたサイトのStyleは、「Twenty Seventeen」でしたが、メインとサイドバーの幅をデフォルト設定から画面いっぱいに広げていました。
WordPress、CSSなど、全く何もわかっていなかった時期でした。
by Google Ads ID19417
iPadで閲覧した時に、デフォルトでは、左右に余白があり有効活用されていませんでしたので、スペースの有効活用の情報収集として、数時間のネットサーフィンの結果、やはり同じような事を考えて、解決されたブロガーさんがおられました。
以下のコードは、プログ「妻と僕。」さんから頂きました。ありがとうございます。
設定方法
WordPress > 左メニュー > 外観 > カスタマイズ > 追加CSS (編集窓にコピペ)
/*
* 説明 : widthを効率化する
*/
@media screen and (min-width: 48em) {
.wrap {
max-width: 1100px;/*記事・サイドバー・余白の全幅*/
padding-left: 2em;/*記事の左余白*/
padding-right: 2em;/*サイドバーの右余白*/
}
.has-sidebar:not(.error404) #primary {
float: left;
width: 67%;/*記事幅*/
}
.has-sidebar #secondary {
float: right;
padding-top: 0;
width: 29%;/*サイドバー幅*/
}
.navigation-top .wrap {
max-width: 1100px;/*メニューバー幅*/
padding: 0.75em 3.4166666666667em;
}
.site-content {
padding: 2.5em 0 0;/*メニューバーと記事の間隔*/
}
}
編集履歴
2019/09/03 Mr.はりきり
2020/07/28 修正(過去の状況であることを明確に記述)
スポンサーリンク
by Amazon ID19245 by Amazon ID13211 スポンサーリンク
【Amazon.co.jp 限定】HP USBメモリ 128GB USB 3.1 スライド式 金属製 HPFD796L-128 GJP by Amazon - ID 24751 3Dプリンター ダヴィンチ Jr. 1.0(造形サイズ15×15×15cm) - 環境に優しい土に返るPLAフィラメント - ダビンチ Jr. 1.0
XYZプリンティングジャパン by AMAZON ID21513 3Dプリンター|ダヴィンチ1.0 pro|オートキャリブレーション機能付|オープンフィラメント可|ABS対応|造形サイズ20×20×20cm|レーザー刻印機能拡張可|積層ピッチ0.02mm~|3F1AWXJP00F -
XYZプリンティングジャパン by AMAZON ID21511 ABS使用可 造形サイズ175×175×175mm オープンフィラメント可 オートキャリブレーション機能付き レーザー刻印機能拡張可 金属系PLA拡張可 3FJSPXJP00G - ダビンチ Jr.Pro X+
XYZプリンティングジャパン by AMAZON ID21509 zedela 5-in-1 USB-Cハブ【3ポート5Gbps by Amazon - ID 24751
用語の解説、関連タグ付き投稿の抽出
theme
Twenty Seventy
two column
テーマ
スポンサーリンク
by Google Ads ID24747 by Google Ads ID23293 by Google Ads ID:11145 by Google Ads ID8603
LIFE , TRIP
目次1 生駒山「宝山寺」2 参道の賑わいは?3 駐車場4 境内5 ジオラマ6 パワースポット7 帰り8 摩波楽茶屋 生駒山「宝山寺」 大阪からは、阪奈道路で奈良方面に向かい、生駒山スカイライン(往復700円)を使って奈良 […]
LIFE , TRIP
目次1 枚岡神社2 駐車場3 大鳥居4 参道5 境内6 枚岡公園7 まとめ 枚岡神社 東大阪市の生駒山麓にある、「枚岡神社 ひらおかじんじゃ」は、立派な参道があります。でも、お土産やは、殆どないため賑わいには欠けますが、 […]
hotel , LIFE , lounge , TRIP
目次1 リーガロイヤルホテル大阪2 駐車場3 ロビー4 メインラウンジ5 苺の和風デザート6 メインラウンジからの風景7 フラワーショップ8 グルメブティック メリッサ リーガロイヤルホテル大阪 梅田にある「リーガロイヤ […]
hotel , LIFE , lounge , TRIP
目次1 リーガロイヤルホテル大阪1.1 ロビー2 スイートルーム3 クラブラウンジ4 窓からの風景 リーガロイヤルホテル大阪 梅田にある「リーガロイヤルホテル大阪」のスイートルームに泊まったことがあります。 本館は、もう […]
restaurant , TRIP
目次1 THE CARPENTERS ARMS1.1 ウィンザー城1.2 店構え2 フィッシュアンドチップス THE CARPENTERS ARMS イギリスのウインザー(Windsor)城の門前町にある、THE CAR […]
更新された投稿の最新順
by Google Ads ID19417
スポンサーリンク
by Amazon ID13339 by Amaozn ID13196 スポンサーリンク
by Google Ads ID:11145 by Google Ads ID24747 by Google Ads ID23293 by Google Ads ID8603
adsense , plugin , WordPress
目次1 はじめに2 Cumulative Layout Shift3 ページのレスポンスを測定するツールサイト4 関連記事5 参考サイト はじめに 当サイトを立ち上げた頃には、もっぱらpluginの追加をすることで、サイ […]
plugin , WordPress
目次1 Widget Logicプラグイン2 条件の例 Widget Logicプラグイン 2020/12現在、updateがされておらず、WordPress の最新Version ではテストされていますせんが、おそらく […]
security , WordPress
目次1 はじめに2 基本的な設定方法3 WordPress プラグイン別3.1 Content of Table Plus はじめに AMP プラグインをインストールしている場合、投稿/ページを公開/更新した際に、AMPの […]
plugin , Synology , WordPress
目次1 はじめに2 ページのAMP化のみでもレスポンス改善は十分高い3 キャッシュプラグインを追加する4 プラグインは専用機能がいい4.1 WP Super Cacheの設定のほんとのところ4.1.1 WP Super […]
by Google Ads ID19417
security , WordPress
目次1 はじめに2 設定ファイル・設定される方のファイル/フォルダ?3 allow?, deny? はじめに WordPressのセキュリティ設定を考えます。WordPressには、各種のファイルがあります。基本的な設定 […]
plugin , Synology , WordPress
目次1 AMPの記事まとめ2 AMPの「更新済みURL」が作成されない問題と対策 AMPの記事まとめ AMPページに対応すべく奮闘しています。当サイトで記事にしたAMP関連と情報リンクをまとめました。 AMPの「更新済み […]
スポンサーリンク
by Google Ads ID:11145 by Google Ads ID24747 by Google Ads ID23293 by Google Ads ID8603
IT
目次1 WebEx1.1 合う、会話する、共同作業する。2 オンライン授業3 テレワーク WebEx 合う、会話する、共同作業する。 テレワークが叫ばれる中、企業に入り込んでいるMicrosoftではない、テレワークの選 […]
by Google Ads ID19417
english
out of office会社にいない out of freeze溶かす
BIOLOGICS , education , KNOWLEDGE
脳下垂体 脳下垂体からは6つのホルモンが分泌される。 成長ホルモンsource (脳下垂体→) Growth Hormone →(肝臓→) IGF-I → (細胞の受容体) source: wikipedia 甲状腺刺激 […]
BIOLOGICS , equipment , process
目次1 バイオロジクスの実製造2 抗体医薬の製造は,プラットフーム化され,既にコモディティ技術となっている3 Flow Chart バイオロジクスの実製造 抗体医薬の製造は,プラットフーム化され,既にコモディティ技術とな […]
BIOLOGICS , culture
目次1 論文の概要2 参考文献 論文の概要 ほとんどの抗体のアミノ酸位置297(Fc)にはグルコシル化部位がある グリコシル化のパターンによっては、薬物動態(PK)、薬力学(PD)に影響を与える その種類は、(1)マンノ […]
english
happy new year 以下は、チャレンジです。あえて日本語の1つの文章にはしません。文節毎に訳して見ます。その方が、日本語に囚われずにすみ、理解が進むからです。 1) I wish you and the you […]
by Google Ads ID:11143(2)