カテゴリー
CSS WordPress

[WordPress] テーマ・カスタマイズ – Twenty Seventyテーマの2カラム表示の幅の拡大 – ID1775 [2019/09/03]

[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 SDSQXCY-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

WordPress 5.3 標準テーマ Twenty Twentyに完全移行 – ID4018
[WordPress] 標準テーマ Twenty Twenty – 文字関連を調整する – ID3892 [2019/12/08]
[WordPress] テーマ・カスタマイズ – Twenty Seventyテーマの2カラム表示の幅の拡大 – ID1775 [2019/09/03]

Twenty Seventy

two column

テーマ

[WordPress] 標準テーマ Twenty Twenty – 文字関連を調整する – ID3892 [2019/12/08]
[愚者は経験から学ぶ] WordPressのあるカテゴリの表示ができないことに気づいた,その奮闘と解決 – ID3549 [2019/11/23]
[WordPress] テーマ・カスタマイズ – Twenty Seventyテーマの2カラム表示の幅の拡大 – ID1775 [2019/09/03]
スポンサーリンク
  • by Google Ads ID24747
  • by Google Ads ID23293
  • by Google Ads ID:11145
スポンサーリンク
by Google Ads ID8603

Update ID21920

AAV, BIOLOGICS, company, COMPANY-FAVOR, virovek
気になる企業 – VIROVEK (バイロベック) – AAV-toxin Vector技術 – ID12859 [2020/03/31]

目次1 VIROVEC2 TransfectionとPlasmid VIROVEC VirovekはSf9/vaculovirusをベースに独自のAAV-toxin技術を持つCMOである。 Hayward, CA, US […]

LIFE, TRIP
[Trip] 生駒山「宝山寺」- 崖に望むパワースポット、参道の店舗も魅力的 – ID13760 [2020/05/17]※

目次1 生駒山「宝山寺」2 参道の賑わいは?3 駐車場4 境内5 ジオラマ6 パワースポット7 帰り8 摩波楽茶屋 生駒山「宝山寺」 大阪からは、阪奈道路で奈良方面に向かい、生駒山スカイライン(往復700円)を使って奈良 […]

LIFE, TRIP
[Trip] 枚岡神社 – そんなに標高は高くないが、大阪平野を見渡せる-パワースポット:枚岡公園がある – ID15821 [2020/12/25]

目次1 枚岡神社2 駐車場3 大鳥居4 参道5 境内6 枚岡公園7 まとめ 枚岡神社 東大阪市の生駒山麓にある、「枚岡神社 ひらおかじんじゃ」は、立派な参道があります。でも、お土産やは、殆どないため賑わいには欠けますが、 […]

hotel, LIFE, lounge, TRIP
[Hotel] リーガロイヤルホテル – 広々としたメインラウンジで苺の和風デザート – ID15871 [2020/05]

目次1 リーガロイヤルホテル大阪2 駐車場3 ロビー4 メインラウンジ5 苺の和風デザート6 メインラウンジからの風景7 フラワーショップ8 グルメブティック メリッサ リーガロイヤルホテル大阪 梅田にある「リーガロイヤ […]

hotel, LIFE, lounge, TRIP
[Hotel] リーガロイヤルホテル大阪 – スイートルーム (2018) – ID15948 [2020/05/17]

目次1 リーガロイヤルホテル大阪1.1 ロビー2 スイートルーム3 クラブラウンジ4 窓からの風景 リーガロイヤルホテル大阪 梅田にある「リーガロイヤルホテル大阪」のスイートルームに泊まったことがあります。 本館は、もう […]

restaurant, TRIP
[Trip] イギリスのウインザー城門前 – フィッシュアンドチップスが美味い THE CARPENTERS ARMS (2016)- ID15966 [2020/05/17]

目次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

最新記事(WordPress, ID:14681)

adsense, plugin, WordPress
[WordPress] CLS; Cumulative Layout Shift – 2021/03からGoogle検索評価のスコアに加わる – ID26235 [2020/12/23]

目次1 はじめに2 Cumulative Layout Shift3 ページのレスポンスを測定するツールサイト4 関連記事5 参考サイト はじめに 当サイトを立ち上げた頃には、もっぱらpluginの追加をすることで、サイ […]

plugin, WordPress
[WordPress] Widget Logic プラグイン – ID26082 [2020/12/17]

目次1 Widget Logicプラグイン2 条件の例 Widget Logicプラグイン 2020/12現在、updateがされておらず、WordPress の最新Version ではテストされていますせんが、おそらく […]

security, WordPress
[WordPress] AMP対応化で、使用しているその他のプラグインによるエラーが出ないようにするために – プラグイン別 [2020/11/16] ID24858

目次1 はじめに2 基本的な設定方法3 WordPress プラグイン別3.1 Content of Table Plus はじめに AMPプラグインをインストールしている場合、投稿/ページを公開/更新した際に、AMPの […]

plugin, Synology, WordPress
[WordPress] 高速化プラグイン「AMP」と定期的に全てのページの静的キャッシュ作成プラグイン「WP Super Cache」で再構成した- ID22640 [2020/12/11]

目次1 はじめに2 ページのAMP化のみでもレスポンス改善は十分高い3 キャッシュプラグインを追加する4 プラグインは専用機能がいい4.1 WP Super Cacheの設定のほんとのところ4.1.1 WP Super […]

スポンサーリンク
by Google Ads ID19417
security, WordPress
[WP] WordPress – ログイン/アクセス制限に関する設定 – ID24132 [2020/10/09]工事中

目次1 はじめに2 設定ファイル・設定される方のファイル/フォルダ?3 allow?, deny? はじめに WordPressのセキュリティ設定を考えます。WordPressには、各種のファイルがあります。基本的な設定 […]

plugin, Synology, WordPress
[WordPress] 「AMP」まとめ – ID22520 [2020/12/13]

目次1 AMPの記事まとめ2 AMPの「更新済みURL」が作成されない問題と対策 AMPの記事まとめ AMPページに対応すべく奮闘しています。当サイトで記事にしたAMP関連と情報リンクをまとめました。 AMPの「更新済み […]

Page: 1 2 23
スポンサーリンク

スポンサーリンク
  • by Google Ads ID:11145
  • by Google Ads ID24747
  • by Google Ads ID23293
スポンサーリンク
by Google Ads ID8603

その他記事(ALL-RANDOM, ID:16786)

IT
[ICT] Cisco WebEx – テレワークやオンライン授業 – ID13870 [2020/04/20]

目次1 WebEx1.1 合う、会話する、共同作業する。2 オンライン授業3 テレワーク WebEx 合う、会話する、共同作業する。 テレワークが叫ばれる中、企業に入り込んでいるMicrosoftではない、テレワークの選 […]

スポンサーリンク
by Google Ads ID19417
BIOLOGICS, education, KNOWLEDGE
[Kw] 脳下垂体 – 6つのホルモンを分泌 – ID18055 [2020/06/23]

脳下垂体 脳下垂体からは6つのホルモンが分泌される。 成長ホルモンsource (脳下垂体→) Growth Hormone →(肝臓→) IGF-I → (細胞の受容体) source: wikipedia 甲状腺刺激 […]

BIOLOGICS, equipment, process
バイオロジクスの実製造プロセスと装置および機材 – ID20713 [2020/02/29]

目次1 バイオロジクスの実製造2 抗体医薬の製造は,プラットフーム化され,既にコモディティ技術となっている3 Flow Chart バイオロジクスの実製造 抗体医薬の製造は,プラットフーム化され,既にコモディティ技術とな […]

BIOLOGICS, culture
[Bio-Edu] Man5化抗体 (mAb)のPKクリアランスは2倍高い – ID18368 [2020/07/04]

目次1 論文の概要2 参考文献 論文の概要 ほとんどの抗体のアミノ酸位置297(Fc)にはグルコシル化部位がある グリコシル化のパターンによっては、薬物動態(PK)、薬力学(PD)に影響を与える その種類は、(1)マンノ […]

english
今日の英語 – クリスマスカードに書く – happy new year – ID6507 [2020/01/08]

happy new year 以下は、チャレンジです。あえて日本語の1つの文章にはしません。文節毎に訳して見ます。その方が、日本語に囚われずにすみ、理解が進むからです。 1) I wish you and the you […]

Page: 1 2 153
スポンサーリンク

スポンサーリンク
by Google Ads ID:11143(2)

- 以下のツールに敬意を示します -
Support to AMP (Accelerated Mobile Pages) by official AMP plugin for WordPress, and compatible powered by
Post viewing : Flex Posts - Widget and Gutenberg Block