WordPressプラグインNewpost Catchを更新する度にレイアウトが崩れる

こんにちは。

セキュリティ上、WordPressを最新版に更新したり、
プラグインを最新に更新する事は必須ですが、
Newpost Catchを更新する度にCSSがデフォルトに
戻されてしまい、レイアウトが崩れてしまいます。

更新時にスタイルシートのファイルだけ上書きしないでくれれば
良いのですが、そうもいかないみたいなので毎回手動で直していて、
結構面倒くさいです。

と言うのは、
更新って、頻繁にあるわけではないので、
たまに更新すると、
「何処をどう直したっけなぁ?」ってなるので、
思い出せなくて結局調整しながら直すんですよ。

とりあえずNewpost Catchが何なのかわからない方のために。

 

Newpost Catch

Newpost Catchは、WordPressの公式プラグインで、
サイドバーなどに使用できるウィジェット。
最新記事をサムネイル画像付きで表示できるプラグインです。

このサイトでも使っていますがこんなやつ。

 

Newpost catchサンプル画像

 

投稿時にアイキャッチ画像を設定すればそれが表示され、
アイキャッチ画像を設定しないと記事中の最初の画像が
表示されます。

また記事に画像がなく、アイキャッチ画像が設定されていないと、
予め用意されているno_thumb.png が表示されます。

 

これがデフォルトでは賢威のサイドバーの横幅には
合っていないようで、そのままだとおかしいので
スタイルシートで調整しているのですが、
Newpost catchの更新の度にデフォルトに戻されてしまいます。

戻されてしまうとこんな事に・・・。

 

Newpost catchサンプル画像

 

ちょっとダサいですよね(笑
縦に長くなってしまうのでビュー的にも良くないです。

日本のサイトってサイドバーの幅が狭い上に
2バイト文字を使用しているので、賢威でなくとも
ほとんどのサイトで同じ現象になっているかと思われます。

以下、修正メモ。

 

デフォルトのCSS

#npcatch li{
	overflow:hidden;
	clear:both;
	margin:0px 0px 0px;
}

#npcatch img{
	float:left;
	padding:5px 10px;
}

#npcatch .title{
	width:135px;
	float:left;
	padding:5px 5px 5px 0px;
}

 

↓これを以下のように変更すれば良い↓

 

#npcatch li{
	overflow:hidden;
	clear:both;
	margin:0px 0px 0px;
	padding:3px 5px 3px 10px;
}

#npcatch img{
	float:left;
	padding:2px 5px;
}

#npcatch .title{
	width:110px;
	float:left;
	padding:0;
}

 

このサイトを基準にしてスタイルシートを書いていますが、
ほとんどのサイトで参考になると思います。

 

 

この投稿は役に立ちましたか? 役に立った 役に立たなかった

 

ネットビジネス速報メールマガジン

 

メルのネットビジネス速報では、悪質高額塾などの被害が拡大しないように
新しい悪質販売者の情報が入り次第、速報でお伝えいたします。

Dreamweaver、Fireworks、PhotoshopなどのTipsやチュートリアルの紹介、
最新SEO情報、その他ネットビジネスに関する情報をいち早く配信しています。

お名前(必須)
メールアドレス(必須)

One Response to “WordPressプラグインNewpost Catchを更新する度にレイアウトが崩れる”

  1. […] 以前にこんな記事を書きましたが、 こんな原始的なめんどくさい方法でなくても解決出来るようです。 今日たまたま作者の今村さんのサイトに行ってみたら、 素晴しい解決方法が書い […]

記事「WordPressプラグインNewpost Catchを更新する度にレイアウトが崩れる」にコメントを残す

*

サブコンテンツ

危険な高額塾

タグ

ボタン アンダーグラウンドメソッド WP 株式会社SRシステム テーマ 短縮URLツール 管理ツール RSS 掲示板 ECサイト 画像 改ざん グラデーション BBIZ postpost 特定のメールアドレス クリックランキング 情報商材 シャンプー ワードプレス プロモーション 関根義光 ライオンアフィリエイト メモ 切り抜き LinkShaker Cash on Wordpress 申請金ビジネス 株式会社SRシステム ヤフオク Newpost Catch IP 高額塾 不労所得の神 村上省吾 三橋美仁 レタープレス Login LockDown 背景 コピーボタン 関根塾 詐欺組織 到達率 球体 スムーズ 蝶乃舞 大園転売塾 大園麗花 .htaccess 株式会社WINGOOD ウインドウ アンダーグラウンドアフィリエイトクラブ ネットショップ 無料 フレンドシップメール 転売大園塾 FireWorks バナー エクスチェンジ getElementByTagName Tiger-Wing 株式会社Free Agent Style 加工 Internet Explorer 感染 FTP カスタマイズ 脆弱性 トレンドアフィリエイト Windows 7 wordpress バックアップ 日本語入力変換ソフト 株式会社A-ブログレス @PAGES SmoothScroll.js ソフト 出店料 YouTube Maniax 2017 ブロックポリシー 既得権益 ブラウザ 自動化 インフォトップ レイアウト 短縮URL レンタルサーバー Google Maps API 土屋ひろし MasterCollection MT インペリアルゴールド 流出 個人情報 トレンドキーワード 放射線 アレックス式ネオせどりスクール ネットゲーム パズル 個人情報流出 system 自己アフィリ ネットビジネス最後の楽園 Favicon 不正アクセス デスクトップ 配布 EC Chrome 権利収入 詐欺 android ライブチャット 賢威 音量アイコン wpXサーバー 固定ページ ブラシ ブロック 改竄 Agency Business 株式会社バンザイ Adobe JavaScript スタイルシート マイクロソフト クラウド入力機能 アフィリエイト ソースコード 副業術 KMS認証 量産 SKナレッジ バイドゥー クラウド変換 SEO ブルートフォースアタック エクスプローラー アドセンス 伊藤 虎太郎 force puzzle 比較 サイト改ざん Diamond Affiliate Masters Program 秒速で1億円稼ぐ男 がら空きビジネス インターネットエクスプローラー ざくざく君 css Thunderbird ツール CGI アフィ匠 登録禁止 表示 やしろひろたみ getElementById サンタ Line 大園式転売塾 Google Maps スクロール explorer タイガーウイング ロリポップ 石井匠 Baidu エディタ wp-login.php 無断送信 切抜き 81a338 もざ RMT 山下 久積篤史 Ban Hammer メルマガ配信システム CS6 マルウエア Extension Manager ネオヒルズアカデミー html 立体 中山秀人 アクセスアップ 加藤 秀吉 無料オファー 特権ビジネス バイマ アイコン ドメイン ファビコン 伊藤塾 google 伊藤虎太郎 ユーチューブマニアクス2017 管理画面 ネットビジネス大全集 フォローマティック ブラクラ tool IBS PHP DOCTYPE エキスパートメール PPC 優先順位 スカイプ プロファイル ネットビジネス やしろ塾 MovableTYpe followmatic レイアウト崩れ クラック 小笠原健一 モザイク XHTML RSS Includes Pages 大西良幸 スマホ twitter IE KMSpico テンプレート 人物 document.all Yahoo ウイルス タスクバー High Concept Marketing Firefox ライン SyntaxHighlighter DTD ぼかし 与沢翼×蝶乃舞 インターネットビジネススクール 百度 アクセス制限 北川 雅嗣 宮田麗花 HTML4.0 ping 新井浩 トラフィック 自己アフィリエイト 株式会社ニュース ソース BUYMA クロスアフィリエイト 不正送信 ハート CS5 インターネット ムーバブルタイプ ツイッター リンクシェイカー 滑らか 上位表示 原田真 復元 定型文 秀吉塾天下統一 ネットガレージ マニュアル WEB 高速ゲーム セキュリティ ランキング Windows ヤフーショッピング アレックス せどり 与沢翼 iphone Wordpress Content Slide 伊藤 歩 ヤフー moza プラグイン ping送信 自動 レビュー Youtube functions.php 池田純矢 office ビジネス

アーカイブ

エステトラブル

このページの先頭へ