Новости Joomla

Quantum Manager нужен сообществу, а автору нужна ваша поддержка!

Quantum Manager нужен сообществу, а автору нужна ваша поддержка!Файловый менеджер Quantum — одно...

Файловый менеджер Quantum — одно из самых популярных решений для Joomla, созданное разработчиком из сообщества Joomla, Дмитрием Цымбалом (@tsymbalmitia). Он делает Quantum удобным, безопасным и современным, обновляет его, исправляет уязвимости и отвечает пользователям — всё это в свободное от основной работы время.

Теперь настал момент для следующего шага: развитие проекта требует больше времени и ресурсов.

0 Пользователей и 1 Гость просматривают эту тему.
  • 26 Ответов
  • 5755 Просмотров
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Здравствуйте уважаемые форумчане! Сразу извеняюсь за свою терминологию, но думаю вам будет понятно. Хочу сделать 2 картинки и разместить их слева и справа соответственно от сайта, но также оставить при этом основной фон сайта(он у меня идет заполнением одной маленькой картинки). Вот такая у меня проблема, чесно посидел на вашем форуме, но ответа не нашел. Спасибо.
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
шаблон резиновый или фиксированный? На таблицах или на дивах?

Принцип такой:делаете два дополнительных дива вокруг основного контейнера с отступами в ширину картинок и вставляете бэкграунды - один слева, другой справа.
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Шаблон фиксированный на div. Я еще пока не знаю как добавить div, но попробую это сделать. А можно просто через CSS добавить две картинки с отступом от центра?
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
Шаблон фиксированный на div. Я еще пока не знаю как добавить div, но попробую это сделать.

покажите шаблон - помогу. Или сайт, или хотя бы название шаба.

А можно просто через CSS добавить две картинки с отступом от центра?

Я такого способа не знаю.
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Шаблон называется S5_Sportopolis.

http://www.shape5.com/demo/sportopolis/

Спасибо Taatshi.
« Последнее редактирование: 11.12.2011, 19:09:42 от val674 »
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Вчера немного (2часа) покапавшись , вот что у меня получилось:

Мой шаблон состоит в сокращенном варианте:

<body id="s5_body">
    
    <div id="s5_top_bar">
          <div id="s5_top_wrap" style="width:925px">
              <div id="s5_date">....</div>
              <div id="s5_navv">....</div>
          </div>
    </div>
    
<div id="s5_outer">
    
     <div id="s5_logo_banner_wrap">...</div>
     <div id="s5_top_modules">...</div>
     <div id="s5_main_bar_wrap">...</div>
     <div id="s5_main_body_wrap">...</div>
     <div id="s5_row_wrap">...</div>
     <div id="s5_bot_row_wrap">...</div>
     <div id="s5_footer">...</div>

</div>

</body>


Я сделал вот так:


<body id="s5_body">
 
 <div id="full"> (добавил общий блок)
  
    <div id="leftbar">"левый блок"</div> (добавил левый блок)
    
    <div id="s5_top_bar">
          <div id="s5_top_wrap" style="width:925px">
              <div id="s5_date">....</div>
              <div id="s5_navv">....</div>
          </div>
    </div>
    
    <div id="s5_outer">
    
     <div id="s5_logo_banner_wrap">...</div>
     <div id="s5_top_modules">...</div>
     <div id="s5_main_bar_wrap">...</div>
     <div id="s5_main_body_wrap">...</div>
     <div id="s5_row_wrap">...</div>
     <div id="s5_bot_row_wrap">...</div>
     <div id="s5_footer">...</div>

    </div>

   <div id="rightbar">"Правый блок"</div> (добавил правый блок)
 </div>
</body>

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


*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
Я смотрела Ваш шаблон. Если я не ошибаюсь, насколько помню по аналогичному от этой фирмы, настройки его ширины задаются в панели управления. Что Вы там поставили?

Для начала вынесите левый и правый свои блоки за full и задайте им ширину Ваших картинок. высоту - автоматом, примерно так:

width:200px;
height:auto;
outline:1px solid #f03;


outline:1px solid #f03; - будет задавать красную рамочку Вашим блокам - для наглядности, что получилось. Когда все сделаете - сотрете

Скорее всего, нужно будет еще их позиционировать - левому, правому и full  добавить

float:left;
position:relative;

Пока это, сделаете - посмотрим дальше. Я эти шаблоны не разбирала, понятия не имею, как он себя поведет)) Думаю, нужно будет добавить еще один див - в котором будут левый, правый и full - и ему задавать margin:0 auto  и ширину, в зависимости от того, что Вы проставили в панели для всего шаба

И сделайте бэкап, прежде чем эксперименты проводить)))


« Последнее редактирование: 12.12.2011, 09:56:33 от Taatshi »
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Правильно - ширина шаблона задается в админке.
Хорошо Taatshi, я сделаю как вы сказали, потом отпишусь...
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
думаю, высоту блокам тоже нужно задать явно - по высоте картинок. бэкграунд блоки не растягивает...
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
1) Вынес левый и правый  блоки за full и задал им ширину вручную
2) Добавить еще один див - в котором левый, правый и full. - назвал  full2

Стиль full и full2 - пока не задавал.

Пока получилось так, что левый и правый блоки прижимаются не к основному контенту, а к левой и правой стороне экрана.
Причем правый прижимается к нижнему правому углу ниже footer....Чего то я не так сделал...

#leftbar {
width:200px;
height:200px;
outline:1px solid #f03;   
float:left;
position:relative;
}

#rightbar {
width:200px;
height:200px;
outline:1px solid #f03;   
float:right;
position:relative;   
}




« Последнее редактирование: 12.12.2011, 13:38:19 от val674 »
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
1. для full2

full2{
margin:0 auto;
width: не знаю что стоит в вашей админке + 400px;
height:auto;
}

ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

danik.html

  • Живу я здесь
  • 2650
  • 353 / 4
А можно просто через CSS добавить две картинки с отступом от центра?
css 3 спасет мир. ну а пока надо извращаться...
【Мегапак Virtuemart:
 • метатеги (description,keywords)
 • заголовки (title)
 • красивые алиасы (чпу) без тормозов и дублей!
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Сделал, вот как получилось.



потом я исправил

#leftbar {
width:280px;
height:700px;
outline:1px solid #f03;   
float:left;
position:absolute;
}
но мне position:absolute не подходит


а вот правый блок не хочет занимать нужную позицию, наверно я неправильно вставил div


« Последнее редактирование: 12.12.2011, 17:57:27 от val674 »
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
блин... я не настолько хорошо разбираюсь в верстке, чтобы вслепую писать)) сайт в сети? Приведите ВСЕ стили, что прописали для full full2 leftbar и rightbar
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Вот:

#full2
{
margin:0 auto;
width: 1500px;
height:auto;
}

#full

{
ничего нет
}



#leftbar {
width:280px;
height:700px;
outline:1px solid #f03;  
float:left;
position:absolute;
}

#rightbar {
width:280px;
height:700px;
outline:1px solid #f03;  
float:right;
position:relative;
}
мне кажется я накосячил в index
« Последнее редактирование: 12.12.2011, 20:07:16 от val674 »
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
пробуем так

full2
{
margin:0 auto;
width: 1500px;
height:auto;
}

full
{
float:left;
width: что в админке;
height:auto;
}

#leftbar {
width:280px;
height:700px;
outline:1px solid #f03;  
float:left;
}

#rightbar {
width:280px;
height:700px;
outline:1px solid #f03;  
float:right;
}

и покажите код куда дивы вставляли
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
#full { float:left; width: 1000px;height:auto;}

#full2{margin:0 auto; width: 1400px;height:auto;}

#leftbar {width:200px; height:700px; outline:1px solid #f03; float:left;position:relative;}

#rightbar {width:200px; height:700px; outline:1px solid #f03; float:right; position:relative;}

я нашел ошибку и сделал вот так:

<body id="s5_body">
   <div id="full2">
       <div id="leftbar"></div>
         <div id="full">.......</div>
         <div id="rightbar"></div>
    </div>
</body>


*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Taatshi, огромное вам человеческое спасибо! Благодаря вам, сделал то что нужно и так как надо...Перенес изменения на сайт, небольшая подгонка и все получилось.. Спасибо!
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
не за что)) приятно было повозиться с соображающим человечком))

Это что))) теперь в эти позиции если понадобится - можно и модули вставлять. Если понадобится)) пропишете так:

<div id="leftbar">
<jdoc:include type="modules" name="leftbar" style="rounded" />
</div>

аналогично для правого)
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Спасибо! ^-^
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
а... да... еще в файле templateDetails.xml дописать позиции - чтобы из админки выбирать

<position>leftbar</position>
<position>rightbar</position>

что-то меня понесло))) спать пойду))
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Здравствуйте уважаемые форумчане. Новую тему не стал начинать, впрнципе это все продолжение старой. При непосредственной помощи Taatshi в решении моей проблемы, мне удалось таки сделать два блока div под фоновые рисунки по обоим сторонам от основного контента. Вставил рисунки, все нормально... но рисунки у меня 400px в ширину.

Проблема в следующем: На маленьких мониторах или при небольших разрешении экрана(при изменении масштаба), основной контент сайта уходит вправо. Т.к. выравнивание идет полевой границе левого блока leftbar. Сначала думал сам справлюсь, но что то не получается. Знающие люди, дайте совет..Спасибо.

*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
Слушайте, я вот тут подумала... если у Вас шаблон фиксированной ширины - нафиг вам вставлять туда две картинки в блоки? Это для резины. Для фиксированного просто сделайте общий фон какой надо и все.
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Taatshi, у меня есть общий фон. Просто Я хочу поставить 2 картинки (боксеров) слева и справа.

А можно добавить еще один фон поверх предыдущего? - z-index - ?
« Последнее редактирование: 14.12.2011, 23:25:14 от val674 »
*

Taatshi

  • Гуру
  • 5258
  • 481 / 2
  • Верстаем и кодим. Обращайтесь ;)
Taatshi, у меня есть общий фон. Просто Я хочу поставить 2 картинки (боксеров) слева и справа.

А можно добавить еще один фон поверх предыдущего? - z-index - ?

Да нет, так нельзя, уже писала. Так сделайте общий фон с боксерами - одной картинкой и замените тот, что есть.

Иначе сайт так и будет считать Ваши картинки рабочими дивами и учитывать их при отображении сайта..
ВЕРСТКА, САЙТЫ ПОД КЛЮЧ, УДАЛЕНИЕ ВИРУСОВ, МИГРАЦИЯ НА JOOMLA 3, ОБНОВЛЕНИЕ  |  ОТЗЫВЫ 
Связь: telegram - Taatshi, почта - Taatshi на яндексе, Skype - Taatshi
*

val674

  • Осваиваюсь на форуме
  • 18
  • 0 / 0
Спасибо, я теперь все понял и сделал.
*

dmonco

  • Осваиваюсь на форуме
  • 28
  • 0 / 0
  • http://dmitryboruk.com
#full { float:left; width: 1000px;height:auto;}

#full2{margin:0 auto; width: 1400px;height:auto;}

#leftbar {width:200px; height:700px; outline:1px solid #f03; float:left;position:relative;}

#rightbar {width:200px; height:700px; outline:1px solid #f03; float:right; position:relative;}

я нашел ошибку и сделал вот так:

<body id="s5_body">
   <div id="full2">
       <div id="leftbar"></div>
         <div id="full">.......</div>
         <div id="rightbar"></div>
    </div>
</body>



Реально хороший пример построения. Работает отлично.
Только у меня возникла проблема. В данном примере ширина блоков фиксированная. А как сделать, чтобы блоки растягивались по ширине одинаково слева и справа в зависимости от разрешения монитора?
Я уже пробовал и проценты прописывать, не помогает. Фиксированная часть сайта начинает слезать либо влево либо вправо либо блоки появляются вверху и внизу.
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Некорректное отображение сайта на смартфоне

Автор Bazilio_69

Ответов: 0
Просмотров: 1335
Последний ответ 04.09.2024, 20:36:06
от Bazilio_69
Изменить заголовок в шапке сайта

Автор kunsaid

Ответов: 0
Просмотров: 2777
Последний ответ 03.12.2022, 18:34:32
от kunsaid
Позиция фонового изображения

Автор Forgiving

Ответов: 2
Просмотров: 1154
Последний ответ 30.03.2020, 10:58:49
от beliyadm
Рамка вокруг изображения (настройка)

Автор KingSnake

Ответов: 10
Просмотров: 2339
Последний ответ 12.08.2019, 14:48:41
от KingSnake
Адаптивное меню для сайта на CSS

Автор YuliaOks

Ответов: 1
Просмотров: 1371
Последний ответ 02.06.2019, 19:31:23
от Taatshi