シェフどうも、「あの人が怒ってるところ見たことない!」でおなじみのChef(@chef_moriawase)です。みなさん、イライラしちゃダメですよ。僕は感情をコントロールしているので、聖人のような気持ちでブログを書いてますよ。ほら、今日だって、アフィリエイト記事書いてますけど、全然イライラしな...イライラs...イライラ...あー!もう!なんでテキスト広告が勝手に改行されるの?!目次1アフィリエイトのテキスト広告が勝手に改行される謎2カスタマイズ内容3コピペで簡単カスタマイズ!4アイコンフォントをつけない5バリューコマースやアクセストレードもカスタマイズ!6まとめたコード7まとめアフィリエイトのテキスト広告が勝手に改行される謎す、すみません...つい取り乱してしまいました。記事の中にA8.netのテキスト広告を入れてみたんですが、なぜか勝手に改行されてしまって...みんな、どうやってあんなにネイティブに埋め込めてるんだろう...?コードの改変はできないし、何かカスタマイズしているんだろうか?ちょっと覗いてみよう...って、えぇ!!コード改変されてるよ!これいいのか?...あ、やっぱりコードの改変はダメなのね。一部の人や、許可を得ている人だけ認められているみたい。「改変していいですか?」っていちいち聞くのも面倒だな...簡単に誰でも使える方法があればいいのに。うーん、自分で考えてみるか!原因は?謎の改行は以下の2つが原因でした。今回のカスタマイズでやることは下記の3つ。A8.netのリンク(a要素)の親要素(p要素)にクラス(a8)をつけるブログやサイトで公開するとついてしまうbr(元のコードにはないタグ)を削除する画像(img)を横並びにする(コードは改変しない)気をつけるべきは、やはり「規約を守ること」です。これを無視しては意味がありません。誰でも簡単にカスタマイズできるように、コピペできるコードを最後にご紹介します。ワードプレスでのカスタマイズ方法ですが、「はてな」でも問題なく使えるはずです。CAUTIONバックアップをとってからお試しください。使用は自己責任でお願いします。クラスをつけるこちらのコードをjavascriptのファイル(.jsで終わるファイル)に追加します。'a8');});クラスをつける流れはこんな感じです。bodyの中のA8.netのコードを探すそのA8.netのコードを囲んでいるp要素に「a8」というクラスをつけるbrを削除するこちらのコードもjavascriptのファイル(.jsで終わるファイル)に追加します。$('.a8').find('br').remove();});A8.netのリンクが入っているp要素の中にあるbrを見つけて削除するというコードです。画像を非表示にするこちらのコードをスタイルシート(.cssで終わりファイル)に追加します。!important;}A8.netのリンクが入っているp要素の中にある幅「1」の画像を横並びにするというコードです。コピペで簡単カスタマイズ!さて、カスタマイズが終わったので、実際に見てみましょう!うん!ちゃんと表示されてますね!いい感じ!まとめたコードはこちらです。!important;}アイコンフォントをつけないそうそう、新規ウィンドウを開く時にアイコンフォントを使っている方もご安心ください。A8.netのテキストリンクだけアイコンフォントをつけないようにすることができます。"\f08e";}↑おそらく、こんな感じのコードだと思いますが、属性セレクタを使って条件分岐すればOKです。"\f08e";}先ほどのjavascriptの時のような感じですね。:not()を使い、A8.netのリンクだけアイコンフォントをつけないようにしています。デザインが微妙に違うと思いますので、参考までに。バリューコマースやアクセストレードもカスタマイズ!せっかくなので、バリューコマースやアクセストレードのテキスト広告も改行させないようにしました。先ほどのコードの応用ですね。改行タグはなかったので、brを削除するコードは必要ありませんでした。!important;}まとめたコードまとめたコードがこちらです。コピペするだけでOKですよ。"\f08e";}まとめこのカスタマイズをしておけば、どのテキスト広告であろうと改行しなくなるので、かなりストレスフリーです。いやー、これで再び聖人のような気持ちになることができます。イライラしててはいけませんよ、みなさん。見るカテゴリー:カスタマイズシェフこのサイト「Fantastech」を運営している人。WordPressテーマ「4536」の開発中にインプットした情報などを発信中。上に表示された文字を入力してください。Stinger5で新着記事にNEWマークを表示するカスタマイズ。「ページを開けません。サーバが見つかりません」の原因は?PHPのstr_replaceとpreg_replace(正規表現)の使い方WordPressで会話風の画像とテキストをコピペで簡単表示!WordPressのユーザー名・パスワードを確認・変更する方法は?Facebookページのユーザーネームが登録・変更できない原因は?ローカル環境のWordPressサイトを本番環境へ移行する方法WordPressオリジナルテーマを管理画面で更新可能にする方法。Jobsの導入方法や注意点などカスタムデータ属性でCSSフレームワークを作ろうきたぞ、国内初の流体シェイプ国内初となる流体シェイプをデザインに取り入れたWordPressテーマ「4536」を公開しました。