Настройка вывода текста на главной странице

Почему это действие  вынесено в отдельный раздел?

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

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

Немного подумав, я пришел к выводу, что самый оптимальный вариант в данном случае, это использовать модуль "Навигация по сайту".
Он идеально подходит для реализации данной задачи!

Поэтому, идем в модуль навигации и добавляем еще одно меню:

В этом меню создаем 3 пункта:

• Владельцу сайта
• Разработчику сайта
• Фрилансеру

Каждый пункт будет у нас и закладка, и заголовок, и текст:

В этом случае поля:

• Текст пункта (на сайте) - будет у нас закладкой.
• Ссылка - оставим пока пустым или с "#". В дальнейшем, возможно, сделаем ссылку на более полный и подробный текст.
• Подсказка - будет заголовок текста.

А вот поля для самого текста у нас не хватает! :(
Нет его!

Значит нужно добавить! Для этого идем в "Меню разработчика" -> "Макеты данных модулей":

В нем выбираем раздел "Навигация по сайту" и в нем добавляем:

• Одно поле типа "Закладки", назвав его "Большой текст"
• И еще одно поле типа "Текст", назвав его еще более оригинально -  "Текст"

Получаем:

Возвращаемся  в меню, отрываем любой пункт на редактирование и видим закладку "Большой текст":

Выбрав эту закладку "Большой текст", получаем возможность вводить любой текст:

Сохраняемся...

Все!
Интерфейс для ввода готов!

Таким же образом в CMS S.Builder версии 4.0 и выше Вы сможете добавить любое количество полей различного вида и формата у большинства модулей системы!

Переходим к настройке вывода.

Создаем макет дизайна для вывода текста на главной

Т.к. вывод этого блока основан на модуле навигации, значит для его настроки опять переходим в "Меню разработчика" -> "Макеты дизайна компонентов" -> "Навигация по сайту" -> "Вывод меню"

Создаем новый макет дизайна меню:

И в закладке "Уровень 1" вставляем следующий код:

• Верх:
  <script>
     var t_id = 0;
  </script>
  
   
• Пункт без подпунктов:
  <div class="butt" id="b_" onClick="JavaScript: show_first_text(, t_id)"></div>
  <div id="t_" style="display:none">
      <div class="block"><div class="bl_l"><div class="bl_r"><div class="bl_bot">
      <div class="bl_lt"><div class="bl_rt"><div class="bl_lb"><div class="bl_rb">
             
     
     <div class="block_inner">
     <H2></H2>
     <p></p>
              </div>
     
      </div></div></div></div></div></div></div>
  </div></div>
  <script>
     if (t_id == 0) t_id = ;
  </script>
  
   
• Низ:
      <div class="clear"></div>
      </div>
  <div id="t_show">
  </div>
  <script>
     function show_first_text(new_id, old_id) {
         document.getElementById('t_show').innerHTML = document.getElementById('t_' + new_id).innerHTML;
         document.getElementById('b_' + new_id).className = "butt active";
         if (old_id != 0) document.getElementById('b_' + old_id).className = "butt";
         t_id = new_id;
     }
     show_first_text(t_id, 0)
  </script>

Код JavaScript набросал только-что сам, так что не ищите его в изначальной верстке. Уверен, можно сделать красивей и оптимальней.
Как говорится, не стреляйте в пианиста. Он играет, как может! К тому же он у нас последний! ;)

Нажимаем "Сохранить" и с удовлетворением наблюдаем, как все просто отлично работает!

Единственно мне кажется, что заголовок "Разработчикам сайтов" лучше заменить на "Веб-студиям".
Теперь на замену этого текста уйдет какие-то 5 секунд. Также, как и добавление новых закладок, исправления текста и т.д.

Переходим к настройке новостной ленты!

Добавить комментарий

Ваше имя:
Ваш e-mail:
Текст комментария:
Введите код: