MadeYourWeb Elastic - разработка универсального современного шаблона CMS Joomla

Тема в разделе "Создание шаблона", создана пользователем Izem, 12.08.2007.

  1. GDie
    Offline

    GDie Недавно здесь

    Регистрация:
    02.01.2007
    Сообщения:
    184
    Симпатии:
    0
    Пол:
    Мужской
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Стоит!
    А историю изменений можно отдельным файликом или в архиве с шабиком сделать...

    2Izem
    Спасибо. Хорошую работу делаешь.
    Шабик может и не нужен никому, но для новичков очень полезное руководство по созданию шаблонов.
     
  2. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Не, ну что это будет, если все налепят одних MadeYourWeb'ов :) Цель этого проекта - не сам шаблон, а скелет шаблона, на основе которого потом довольно легко можно будет собрать свой шаблон.

    GDie, да, с историей изменений хорошая идея. Спасибо!
     
    Последнее редактирование: 18.08.2007
  3. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    MadeYourWeb Elastic v0.7.1 beta :

    [ -- ] Удалён "обёртывающий" DIV "outer" за ненадобностью.
    [ -- ] Удалён css-хак из класса centercol за ненадобностью.


    После изменения структуры шаблона, проведённой в версии 0.7.0, провёл небольшую ревизию кода. Выяснил, что в связи с уменьшением количества глюков в IE5/6 вполне можно отказаться от использования некоторых "обёртывающих" DIV'ов и некоторых css-хаков IE. Удалил из шаблона DIV "outer" и css-хак IE5, применявшийся в классе centercol.
     
    Последнее редактирование: 18.08.2007
    OlegM нравится это.
  4. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    MadeYourWeb Elastic v0.8.0 beta :

    [ + ] Добавлены варианты вёрстки: в 2 колонки - центральная + правая и в 1 колонку - только центральная.

    После изменения структуры шаблона, проведённой в версии 0.7.0, появилась возможность довольно легко добавить в шаблон ещё два варианта вёрстки: центральная + правая колонки и всего одна центральная. Воспользовался php-кодом оригинального MadeYourWeb, немного дополнив его, и добавил недостающие css-классы.
     
  5. Offline

    baser Недавно здесь

    Регистрация:
    15.08.2007
    Сообщения:
    5
    Симпатии:
    0
    Пол:
    Мужской
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Добрый день. У меня возник вопрос по поводу работы данного шаблона. При использовании KinoArhiv_1.0_beta_4 почему то в IE6 содержимое съезжает вниз (менял правую и левую колонки (их размеры и отступы), безрезультатно), но вот в Mozilla все работает отлично, может подскажите что подправить? Скрины проблемы прилагаю

    А так шаблон довольно неплохой с хорошими задатками, перепробывал около 100 шаблонов, понравилось только штук 8-9, так как не люблю фиксированные шаблоны, так как на 1600х1200 смотрятся ужасно
     

    Вложения:

    • IE.jpg
      IE.jpg
      Размер файла:
      92.9 КБ
      Просмотров:
      14
    • Mozila.jpg
      Mozila.jpg
      Размер файла:
      134.4 КБ
      Просмотров:
      17
  6. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Вообще, со съезжанием вниз контента в IE6 огромная проблема, но в последних версиях шаблона я практически это дело починил. Но проверить во всех компонентах, конечно же, не смог...

    А какая версия шаблона использовалась?
     
    Последнее редактирование: 19.08.2007
  7. Offline

    baser Недавно здесь

    Регистрация:
    15.08.2007
    Сообщения:
    5
    Симпатии:
    0
    Пол:
    Мужской
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    madeyourweb_elastic.v0.8.0
     
  8. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Ага. Ладно, я посмотрю. В принципе, если будет возможность, засада должна вылечиться назначением для IE5/6 -3px левому и правому маргинам компонента. Похоже, в нём жётко зашито width: 100%, а IE6 это значение терпеть ненавидит...

    Дописано позже:

    Ну, так я и знал :( На таблицах свёрстано... И width: 100%... Попробую чего-нибудь придумать...
     
    Последнее редактирование: 20.08.2007
  9. Offline

    baser Недавно здесь

    Регистрация:
    15.08.2007
    Сообщения:
    5
    Симпатии:
    0
    Пол:
    Мужской
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    все больше не надо, мне уже помогли, надо было добавить

    div.content {width: 99%!important;}


    и сразу все стало на место
     
  10. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Нет, это нехорошее решение (проходили, отказались) - у тебя дырка будет справа между контентом и правой колонкой шириной 1% - на большом мониторе некрасиво, а на маленьком (или при уменьшении окна) - всё равно контент будет спрыгивать вниз.

    Красивое решение я нашёл. Делаю новую версию. Сегодня выложу.
     
  11. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    MadeYourWeb Elastic v0.8.1 beta :

    [ V ] Изменён способ исправления "съезжания" вниз в IE5/6 контента центральной колонки в некоторых компонентах.
    [ -- ] Удалены классы div.contentpane и table.contentpane за ненадобностью.


    baser сообщил, что в компоненте KinoArhiv контент центральной колонки в IE6 опять съезжает вниз. На вскидку были два проверенных способа исправления ситуации: сделать ширину DIV'а .content { width: 99% } или присвоить всем элементам, находящимся в content'е, { margin-left: -3px; margin-right: -3px; } .

    Метод "width: 99%;" плох тем, что между контентом центральной колонки и правой колонкой появляется разрыв шириной 1% от ширины центральной колонки, причём на больших разрешениях монитора этот разрыв будет иметь довольно заметную ширину, а при уменьшении ширины окна IE6 всё равно контент будет спрыгивать вниз. Потому этот метод годится только как временный вариант до подбора более качественного решения.

    Вариант с левым и правым маржинами размером в -3px не страдает от указанных выше недостатков, но довольно сложен в реализации. Приходится прописывать новые классы, уходящие "вглубь" content'а, для разных типов компонентов - разные классы. И всё равно, наверняка, найдётся такой компонент, который имеющиеся классы не описывают...

    Поэтому пришлось искать другое, универсальное, решение. После долгого чтения интернета и многочисленных экспериментов был найден на удивление простой способ: добавить в класс .content следующие параметры: { width: 100%; float: left; }. И всё в IE5/6 заработало как надо. Даже wrapper. А другие браузеры, похоже, ничего такого и не заметили. ;) Я так и не понял, почему это решение помогло, но то, что оно работает - это точно...
     
    Последнее редактирование: 22.08.2007
  12. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    MadeYourWeb Elastic v0.9.0 beta :

    [ V ] Исправлено отбражение в IE5/6 бэкграунда Топ-меню.
    [ V ] Изменён метод исправления отображения в IE5/6 модуля pathway.
    [ + ] Добавлена поддержка в IE5/6 свойства css:hover для любых элементов.
    [ + ] Добавлена поддержка в IE5/6 прозрачных PNG-24.
    [ + ] Объединены файлы template_css.css и css_color_green.css .
    [ V ] Произведена оптимизация файлов шаблона.


    1. В оригинальном MadeYourWeb в IE5/6 неправильно отображался бэкграунд Топ-меню. Было найдено только одно 100% работающее решение - применение для IE5/6 свойства behavior:url и файла *.htc. Подробно описано здесь. Но свойство behavior не является стандартным, и поэтому нам нужно показывать его только для IE5/6 и как-то спрятать от остальных. И поэтому для того, чтобы код шаблона при использовании нестандартных свойств всё равно проходил валидацию, применён замечательный метод <!--[if IE]>...<![endif]-->, о котором подробно описано в документе по этой ссылке (Только, внимание! Не копируйте мышкой с той страницы код - он переносится с ошибками - набирайте текст примеров с клавиатуры!).

    2. Для корректного отображения в IE5/6 модуля pathway я ранее использовал назначение левому и правому маржинам модуля значения -3px. Но был найден другой, более корректный способ, описанный в версии 0.8.1, - присвоение модулю значений { width: 100%; float: left; }.

    3. Как известно, IE5/6 не умеет обрабатывать прозрачность файлов PNG-24. Существует проверенный метод со свойством behavior:url, реализованный по той же схеме, что и описанный выше метод исправления css:hover . Этот метод широко описан в сети, а его файлы позаимствованы мною из шаблона "D4 Magicblue" (в этом шаблоне использован самый корректный вариант файла iepngfix.htc, учитывающий, что IE7 отлично отображает прозрачные PNG, и ему не требуется данное исправление).

    4. Решил объединить template_css.css и css_color_green.css, потому что было очень неудобно править css-код в двух файлах одновременно, и при одноцветном шаблоне практический смысл этого разделения отсутствует.

    5. Привёл в порядок названия файлов шаблона и их каталоги, удалил неиспользуемые файлы, подчистил css-код.
     
    Последнее редактирование: 22.08.2007
  13. Sedoy
    Offline

    Sedoy Пользователь

    Регистрация:
    26.09.2005
    Сообщения:
    39
    Симпатии:
    2
    Пол:
    Мужской
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    На данный момент - это версия 0.8.1 beta.
    MadeYourWeb Elastic v0.9.0 beta :

    так какая все же последняя?
    а не хочешь добавить в него кнопки "узко-средне-широко"?
    с резиной все таки не всегда угадаешь с контентом в котором есть скажем картинка
    т.к. она имеет размер жесткий, то на узком мониторе будет рвать шаблон, ну в лучшем случае появиться гор. скролбар
     
  14. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Всё, выложил версию 0.9.0 - пришлось много изменений вносить в файлы, потом ошибки правил. Вроде, сейчас нормально.
    Не, я во втором сообщении в этой теме уже свои идеи написал - я не хочу делать чисто резиновый или фиксированный шаблон. Я хочу сделать универсальный НАСТРАИВАЕМЫЙ интеллектуальный шаблон, который будет подстраиваться под ширину окна браузера по довольно сложному алгоритму. А Вебмастер сможет настроить ключевые точки скрипта по своему усмотрению. Этот скрипт уже почти готов и появится в RC. Сейчас я его жёстко тестирую.
     
    Последнее редактирование: 22.08.2007
  15. Sedoy
    Offline

    Sedoy Пользователь

    Регистрация:
    26.09.2005
    Сообщения:
    39
    Симпатии:
    2
    Пол:
    Мужской
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    ок посмотрим :)
     
  16. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    У меня вопрос ко всем знатокам XML. Как написать команду в templateDetails.xml так, чтобы при установке шаблона какой-либо файл записывался в корень сайта, а не в каталог устанавливаемого темплейта? Подскажите, пожалуйста, - очень надо!
     
    Последнее редактирование: 22.08.2007
  17. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    MadeYourWeb Elastic v0.9.0.1 beta :

    [ V ] Исправлен путь к файлам *.htc для IE5/6 .

    Выяснилось, что исправление работы css:hover в IE5/6 работает не на всех сайтах. =O После долгих поисков истины обнаружил, что для сайтов, установленных в директорию, а не в корень сайта, путь к файлам *.htc обязательно должен начинаться с точки, т.е. быть таким: behavior: url("./templates/madeyourweb_elastic/css/iefix/file.htc"). :hz: Большой привет Микрософту... :bye:
     
    Последнее редактирование: 23.08.2007
  18. ryar
    Offline

    ryar Недавно здесь

    Регистрация:
    25.08.2006
    Сообщения:
    1
    Симпатии:
    0
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Пара небольших замечаний.
    1. Индикатор загрузки страницы - а нужно ли ваще такая фишка как факт? К тому же в таком виде как сейчас? Индикатор спрятан в верхнем правом углу экрана, и почти незамечен. Специально не поленился, собрал сотрудников на фирме показал шаблон, из 5 человек индикатор не увидел никто. :((

    2. В FF при расширении монитора 1280px в футере изображение центрируется по левому краю и стандартный текст выходит за пределы изображения.
     
  19. Offline

    Izem Недавно здесь

    Регистрация:
    08.01.2007
    Сообщения:
    53
    Симпатии:
    2
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    Спасибо за внимание к моей работе! с|:)

    По сути вопроса: я делаю этот шаблон не для того, чтобы сделать унивесальный шаблон, а для того, чтобы сделать универсальный скелет шаблона. Думаю, никому в голову не придёт использовать этот шаблон в неизменном виде у себя на сайте. Вебмастер по своему вкусу заменит анимашку и изменит её место в своём шаблоне (код уже есть, посему проблем не возникнет). Кстати, когда анимашка стоит посреди экрана - это жуткий ацтой - глаза "проедает" только так минут за 10-15!

    Футер ещё не готов, точнее, я им даже ещё и не занимался. В планах - изменить футер вообще.
     
    Последнее редактирование: 23.08.2007
  20. OlegM
    Offline

    OlegM Russian Joomla! Team Команда форума

    Регистрация:
    12.04.2007
    Сообщения:
    4 356
    Симпатии:
    370
    Пол:
    Мужской
    Ответ: MadeYourWeb Elastic - разработка универсального современного шаблона

    И не забудь удалить рекламные ссылки :)

    Надо обновить Joomla до 1.0.13 - там исправлены баги, из-за которых сайт не проходит валидацию
     

Поделиться этой страницей

Загрузка...