Question

Добрый день, заранее всем админам и модераторам, что ответят на вопрос.

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

Не могли бы вы сказать, как создать, и расположить блоки, и справа и слева на главной странице? ( с обеих сторон от ленты новостей)

Дизайн сайта по шаблону №798.

Answer 1

Чтобы данный шаблон сделать с 2-мя контейнерами, нужно перерисовывать изображения  и переписывать много стилей, шаблон был задуман лишь на один контейнер, если добавить второй, без всякого перерисовывания и с минимальными изменениями CSS, может получиться примерно так.

Обратите внимание, центральная часть где должен быть контент стала значительно уже из-за того, что добавился второй контейнер, если вам так пойдет? я вам объясню как это сделать.

В другом случае нужно править стили глобальнее и плюс рисовать изображения шаблона под нужные размеры под 2 контейнера.

Comments

Объсняйте нам так пойдет))) на всякий случай ссылка на сайт на котором нужно это сделать http://www.ian-damon-ss.com/

---

1. Перед изменениями, обязательно перейти в Панель управления - Главная - Дизайн - Резервное копирование шаблонов - Создать резервную копию. Это на случай если наломаете дров в шаблоне и имели возможность восстановить все в прежний вид.

2. Первым делом создайте Второй контейнер(глобальный блок где будут ваши блоки), перейдем по адресу - http://www.ian-damon-ss.com/panel/?a=gblocks  жмем на кнопку - Добавить блок в название вводим - DRIGHTER и жмем кнопку - Добавить. Второй контейнер создан))

3. Далее перейдем в Управление дизайном к примеру - Страницы сайта - http://www.ian-damon-ss.com/panel/?a=tmpl;m=2;t=0 найдем почти в самом низу страницы код:

<div id="rightcol">
<div id="soc">
<?if($RSS_LINK$)?><a href="$RSS_LINK$" target="_blank" title="RSS" class="soc-rss"></a><?endif?>
<a href="http://del.icio.us/post?url=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Del.icio.us" class="soc-del"></a>
<a href="http://www.facebook.com/share.php?u=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="FaceBook" class="soc-facebook"></a>
<a href="http://memori.ru/link/?sm=1&u_data[url]=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Memori" class="soc-memori"></a>
<a href="http://vkontakte.ru/share.php?url=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Vkontakte" class="soc-vkontakte"></a>
<a href="http://twitter.com/share?url=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Twitter" class="soc-twitter"></a>
</div>
$GLOBAL_CLEFTER$
</div>

добавим после этого кода второй контейнер:

<div id="leftcol">$GLOBAL_DRIGHTER$</div>    

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

4. После проведем в таблицу стилей CSS и добавим в стили после строки 254 следующие стили:

#leftcol {
 float: left;
 width: 256px;
 margin: 0 5px;
 margin-right: 10px;
 text-align: justify;
 position: absolute;
}

и так же после этих стилей добавим еще стили:

.eBlock {
    left: 128px;
    width: 460px;
    margin: auto;
    position: relative;
}

Вроде как все, пробуйте, после отпишитесь о результате.

---

Вроде все делаю, как вы написали но почему то не отображаются блоки слева(((

---

Вы все удалили с сайта, проблемы я не вижу и ничем не могу помочь, кроме того, что нужно все выполнить как описано выше, чтобы увидеть блоки нужно парочку тестовых поместить в второй контейнер.

---

Хорошо, попробую поместить, спасибо)) опишусь как получится.)) Я просто чтобы не сбить ничего на сайте, тренируюсь на "копии сайта"))) вот, поэтому вы ничего не увидели. Но и не увидили бы, так как не оборажается.)) Но спасибо за подсказку, что то поместить в контейнер буду пытаться)

Почему вот так? И как это выровнять?

http://shadowhunters.ucoz.net/index/0-2

---

в стилях строка номер 241:

#maincol {
 float: left;
 width: 714px;
 margin-left: 10px;
 text-align: justify;
 padding-bottom: 10px;
 left: 260px;
 position: relative;
}

добавить выделенное красным, параметр 260px регулирует отступ от левого контейнера