広告 300×250のウィジェットにAdsenseのレスポンシブを貼るとマージンがなくなってしまいます。

Simplicityの特徴 フォーラム Simplicity2に関する話題何でも 広告 300×250のウィジェットにAdsenseのレスポンシブを貼るとマージンがなくなってしまいます。

このトピックには12件の返信が含まれ、1人の参加者がいます。3 ヶ月、 2 週間前 lin さんが最後の更新を行いました。

  • 投稿者
    投稿
  • #59194

    lin

    お世話になります。
    現在、simplicity2.6.5.1を使わせて頂いてます。

    表題のように広告 300×250のウィジェットにAdsenseのレスポンシブを貼るとスマホでマージンがなくなってしまいます。

    本文と同じマージンがあるはずなのに、何故か分かりません。
    .ad-space マージンを指定してもダメでお手上げになりました。

    申し訳ありませんが、ご助言頂けると助かります。

    アドレスは
    https://www.bluelady.jp/
    です。

    よろしくお願いいたします。

  • #59199

    かうたっく

    表題のように広告 300×250のウィジェットにAdsenseのレスポンシブを貼るとスマホでマージンがなくなってしまいます。

    親テーマで指定がある通り、上下のmarginが30pxありますよ。スマホビューで見ましたが。

    本文と同じマージンがあるはずなのに、何故か分かりません。
    .ad-space マージンを指定してもダメでお手上げになりました。

    topページも本文と同じmarginもあるようです。どの部分もおかしくないようですが、どのブラウザ・どのスマホで見るとどこがおかしいですか?

    それからどの部分のどこを見てるか、どこの余白が気になるかも念のため教えてもらっていいですか。
    https://wp-simplicity.com/suport/topic/uploaders/

    “.ad-space マージンを指定”はどこにされてますか?見た感じどこにも指定がないようです。.ad-labelの指定はhead内にあるようですが…。

  • #59205

    lin

    かうたっくさん、すみません。
    言葉足りませんでした。

    左右のマージンです。
    画面の横幅にピッタリくっついてます。
    文章は左右10ピクセルほどのマージンがあるので、それと同じようにしたいです。

    .ad-space {
    margin-right: 10px;
    margin-left: 10px;
    }

    を追加してみましたが、ダメだったので今は削除してあります。

    よろしくお願いいたします。

  • #59206

    lin

    スマホはXperia zxでAndroid 7.0です。
    iPhone SE()iOS11でも同じでした。

    display: block;を入れてもだめでした。今は削除してあります。

    .ad-space {
    display: block;
    margin-right: 10px;
    margin-left: 10px;
    text-align: center;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    }

    すみません。
    よろしくお願いいたします。

  • #59207

    Akira

    レスポンシブ広告ユニットについてをご覧ください。

    モバイル端末に全幅広告を表示。Google が行ったテストの結果、モバイル端末が縦表示の場合には、全幅サイズのレスポンシブ広告で成果が上がることが判明しています。そのため、サイトでの広告収益が増えるよう、ユーザーの端末が縦向きの場合にはレスポンシブ広告ユニットを自動的に拡大し、画面の幅いっぱいに表示します。

    広告収益が上がると Google が判断しているので、そのままでいい気がします。

  • #59210

    かうたっく

    読み込みが行われた際アドセンス側が自動的に、スマホ幅にあわせて画面いっぱいに表示してるようですね。レスポンシブのように最適化されてるようなので、Akiraさんの言う通りで良いと思います。

    アドセンスの広告をレクタングル300 x 250に変えるのであれば、自動的に真ん中に来るかと思いますが、現在どの広告を使っているかわかりません。今レクタングルではなくレスポンシブの広告コードをつけてますか?

    レクタングル300 x 250のサイズの場合で左による事がもしあればCSSで調整しても良いかと思います。例:margin: 30px auto;

  • #59211

    lin

    Akiraさま、ありがとうございます。
    画面いっぱいになったアドセンスを配置しているサイトをあまり見ないので、なんとか左右のマージンをあけたいと思って、今までいろいろやってみました。
    このまま諦めるのは、なんだか寂しい気がしてます。
    ここの掲示板しか、頼るところがありません。
    よろしくお願いいたします。

  • #59213

    lin

    かうたっくさま、ありがとうございます。

    300 x 250の広告コードも配置してみました。
    その場合はセンター配置のDivで囲んでやれば問題ありません。

    問題はレスポンシブの広告コードです。
    以前はdata-ad-format=”rectangle”で、きちんと左右が空いていたように記憶しているのですが、今ではそれも効かなくなってしまいました。

    細かいことなのですが、上手くいかなくなると気になってしまって、どうしてもマージンを空けたい気持ちが強まっています。

  • #59214

    かうたっく

    問題はレスポンシブの広告コードです。
    以前はdata-ad-format=”rectangle”で、きちんと左右が空いていたように記憶しているのですが、今ではそれも効かなくなってしまいました。

    細かいことなのですが、上手くいかなくなると気になってしまって、どうしてもマージンを空けたい気持ちが強まっています。

    レスポンシブは、多分Googleさん側で操作してそうかもしれません。横幅が決まってない(完全自動な)ので何ともいえなですよねぇ。

    横幅をXと考えてマイナス指定できればいいんですが、プロパティが出てきません。思いつくものを試したいんですが、Cから始まった気がするとしか思い出せません>< ※思い出して成功すれば書き込みますね。

  • #59215

    lin

    かうたっくさん、ありがとうございます。
    以下で試してみましたが、だめでした。

    .ad-space {
    display: block;
    width : calc(100% – 20px) ;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    }

  • #59216

    かうたっく

    width : calc(100% – 20px);でなくてもwidth: 80%;として指定しても無理な気もします。幅に合わせ配信してるので、こちらサイドでのCSS指定は効かないのかと。仕様が実際変わってますし。

    幅80%と指定してキャッシュのない状況で再読み込みし(両サイドauto指定があるので)ずれ込んで表示(広告がはみ出すなどあれば)『レスポンシブだとそれが仕様。』としか言いようがない気がします。

    やれる事をして無理であれば仕様が変わったのが原因・理由かなと。

  • #59217

    Akira

    レスポンシブ広告ユニットについてはご覧になられましたか?

    全幅レスポンス広告を無効にするレスポンシブ広告のタグパラメータの使用方法へのリンクも掲載されています。

    レスポンシブ広告コードに以下を追加するだけです。

    data-full-width-responsive="false"

  • #59218

    lin

    Akiraさま、ありがとうございました。
    ご指摘のパラメーターを入れたらマージンが出来ました。

    私はこの件でずいぶん長い間悩んでいたものですから。
    マージンが出来てホッとしています。

    心からに感謝いたします。

トピック「広告 300×250のウィジェットにAdsenseのレスポンシブを貼るとマージンがなくなってしまいます。」への新規返信追加は締め切られています。

スポンサーリンク
アドセンス(大)
アドセンス(大)