Адаптация CSS

[LyalinDV 13]

Добрый день форумчани! Для полноценной адаптации своего сайта мне необходимо сделать пару адаптаций, которые я сам пока не могу реализовать. Суть проблемы:

 

1. На многих страницах сайтах установлен дополнительный код adsense. Он имеет размер 720х90. Как сделать прописать в @media screen, чтобы этот код adsense менялся на другой (адаптивный)?. Сразу говорю, что возможности ручками менять этот код на всех страницах - нет.

 

2. Как реализовать так, чтобы через @media screen на определенных разрешениях либо не показывались виджеты, либо показывались другие?

[Transformer 442]

 

 

Он имеет размер 720х90. Как сделать прописать в @media screen, чтобы этот код adsense менялся на другой (адаптивный)?

 

сделать два блока, для мобильных и для десктопа

 

показывать в зависимости от разрешения экрана пользователя

[LyalinDV 13]

сделать два блока, для мобильных и для десктопа

 

показывать в зависимости от разрешения экрана пользователя

 

Немного не поняли. Мне необходимо, чтобы в зависимости от разрешения этот код менялся на другой, то есть вносить еще один код на каждую страницу нет возможности. 

[Шутник 23]

Немного не поняли. Мне необходимо, чтобы в зависимости от разрешения этот код менялся на другой, то есть вносить еще один код на каждую страницу нет возможности. 

У каждого разрешения в медиа скринах создаете два css стиля или контейнера, один например rec1 , а второй rec2 после чего для разрешения например свыше 990рх rec1 display: block; а rec2  display: none; и наоборот )

[LyalinDV 13]

У каждого разрешения в медиа скринах создаете два css стиля или контейнера, один например rec1 , а второй rec2 после чего для разрешения например свыше 990рх rec1 display: block; а rec2  display: none; и наоборот )

Можете более подробно написать? а то слабый программист

[Шутник 23]

Можете более подробно написать? а то слабый программист

 В CSS создаете два контейнера:

@media screen (min-width: 990px) and (max-width: 1200px) {

.rec1 {

    display: block;

    width: 720px;

    height: 90px;

}

.rec2 {

    display: none;

    width: 99%;

    height: 90px;

}

}

@media (max-width: 990px)

.rec1 {

    display: none;

    width: 720px;

    height: 90px;

}

.rec2 {

    display: block;

    width: 99%;

    height: 90px;

}

}

Потом вставляете в HTML

<div class="rec1">Код рекламы 720</div>

<div class="rec2">Код рекламы для моб. и планшетов.</div>

Как то так )

[LyalinDV 13]

<div class="rec1">Код рекламы 720</div>

<div class="rec2">Код рекламы для моб. и планшетов.</div>

 

В каждую страницу вставить?

[Шутник 23]

 

<div class="rec1">Код рекламы 720</div>

<div class="rec2">Код рекламы для моб. и планшетов.</div>

 

В каждую страницу вставить?

 

Где хотите видеть рекламу, туда и вставляете )

[LyalinDV 13]

Где хотите видеть рекламу, туда и вставляете )

 

Страниц очень много. Через шаблон single.php тоже не вариант, так как вставлял вручную на каждую страницу

[Шутник 23]

Страниц очень много. Через шаблон single.php тоже не вариант, так как вставлял вручную на каждую страницу

Ну а как вы хотели, хоть как надо ручками вставлять, скрипты то сторонние ) 

[LyalinDV 13]

А может можно придумать скрипт, определяющий рекламу adsense и меняющий ее?

[Шутник 23]

А может можно придумать скрипт, определяющий рекламу adsense и меняющий ее?

У них есть свой адаптивный баннер, его вставьте, он сам будет настраиваться под разрешение.

[FreeWebmaster 1]

Я раньше тоже в текст статьи на каждой странице код вставлял, потом вовремя понял, что погорячился, и тут нужен код в шаблоне, чтобы адним махом поменять при надобности на всех страницах. Можно про старые страницы забыть и вновых ставить адаптивный код. Поставить адаптивный код в шаблон так просто тоже здесь не получится, надо будет убирать ваш старый на всех старых страницах, иначе будет две рекламы вместе. Лично у меня отдельный мобильный шаблон для сайта.