kattiperk

Добавить слайдер в статью - это вставить его уже в контент статьи - http://joxi.ru/KAgMOn8Cg5Xz8m А макет такой: 1-слайдер, 2-дата, авторы, соц.сети, 3-контент статьи, он же шаблон.

Здравствуйте. Возник вопрос - как добавить слайдер вне шаблона статьи на WP? Или как допилить шаблон, чтобы шел слайдер на всю ширину, потом заголовки, дата и соц. сети, а потом уже контент статьи. Шаблон простой самописный, что будет меняться - так это статьи, их контент и фото. http://joxi.ru/L21jZw0S6zXjkA На скриншоте можно видеть расплющеные фото - это место слайдера, он на всю ширину должен быть. Сам текст начинается ниже - это и есть начало шаблона статьи, пункт 5. Пункт 4 - это я попробовала добавить слайдер. Остальное, кроме пункта 2 - навигация, заголовки, дата - всё попадает автоматически в шаблон. Кусок шаблона статьи <div class="content-wrapper common-content-wrapper"> <!-- ABOUT US BLOCK START --> <div class="content-inner-block-wrapper"> <div class="content-inner-block"> <h3 class="inner-page-heading">Блог</h3> <!-- BREADCRUMBS START --> <div class="breadcrumbs-wrapper clearfix"> <ul class="breadcrumbs-list"> <?php the_breadcrumb(); ?> </ul> <div class="inner-page-navigation-wrapper"> <a href="http://wingchung.com.ua/blog/" class="btn navigation-button">вернуться</a> </div> </div> <!-- BREADCRUMBS END --> </div> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div class="content-photo-banner-wrapper"> <!-- тут стоят те расплющеные картинки, именно это место слайдера --> <div class="photo-banner-block"> <div class="photo-banner"> <img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" data-src="/wp-content/themes/wingchung-theme/img/media/blog/blog-banner-image-2.jpg" alt="" class="photo-banner-image"> </div> <div class="photo-banner"> <img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" data-src="/wp-content/themes/wingchung-theme/img/media/blog/blog-banner-image-1.jpg" alt="" class="photo-banner-image"> </div> <div class="photo-banner"> <img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" data-src="/wp-content/themes/wingchung-theme/img/media/blog/blog-banner-image-3.jpg" alt="" class="photo-banner-image"> </div> </div> </div> <div class="content-inner-block"> <div class="article-wrapper"> <div class="article-data-block-wrapper scrollflow -slide-right -opacity"> <div class="article-data"> <span class="date">Дата</span> <span class="date-counter"><?php the_date('j F Y'); ?></span> </div> <div class="share-block"> <span class="share-text">Поделиться:</span> <div class="social-networks clearfix"> <script type="text/javascript" src="//yastatic.net/share2/share.js" charset="utf-8"></script> <div class="ya-share2" data-services="facebook,vkontakte" data-bare></div> </div> </div> </div> <div class="article-content-wrapper"> <h3 class="article-heading"><?php the_title(); ?></h3> <div class="article-author"> Текст <span class="author-wrapper"><?php the_author(); ?></span> </div> <!-- а вот начало статьи, он же пункт 5, сюда и вставился тот слайдер --> <?php the_content(); ?> </div> </div> </div> <?php endwhile; ?> <?php else : ?> <?php endif; ?> </div> </div>

Нарек, я шутила вроде. Уже не помню, что вчера писала.

а вас не смущает что "флексы" это CSS, а div это HTML? давно на сайт w3c заходили? там же флексы ввели

Почитайте в API плагина. Что-то не хочется самой смотреть, но, кажется, там всё просто

При наведении - http://matthew.wagerfield.com/parallax/ При прокрутке оси поменять в своем плагине. Ну или этот посмотрите - http://jonraasch.com/blog/scrolling-parallax-jquery-plugin

Немного про адаптивность (гифка) http://vk.com/doc2000015772_437208514?hash=85cca27e155ced16bb&dl=d9e237d1ec3a0104d6

Сначала нужно пройти регистрацию - самому заполнить данные, а потом созвониться по скайпу с камерой и показать им первую страницу паспорта и его номер. Тогда уже можно отвечать заказчикам и брать заказ. Заказов полгода назад было не очень много. Основные - лендинг за 200 грн, сайт-магазин за 1000 грн на 20 страниц. Были и просто доработки. Основной минус - нет детального описания в задании, приходилось постоянно писать в комментариях к проекту о дополнительных требованиях, ТЗ или самому попытаться угадать что хотят. Это раздражало и не хотелось вообще откликаться на те заказы, так как уточнять надо, потому что нажав "Выполнить" (вроде так кнопка называлась) вы уже как бы со всем согласны и сделаете что попросит заказчик. Оплата через сайт, он забирает небольшой %, о чем написано открыто в условиях или при регистрации. Вывод денег без проблем на карту, WM и еще какие-то сервисы. Мне попался изначально адекватный заказчик. Требовалось сделать адаптивность сайта из 4-5 страниц. Условия обсудили заранее, кого куда перемещать и как растягивать или не растягивать картинки и всякие поля форм. Попросила уникальные страницы, так как времени на задание было мало и знакомиться с сайтом долго не хотелось в поисках страниц ведущих со страниц при условии нажатия на кнопку "Купить" развернув спойлер предварительно нажав на слайдер. Тот сайт делали давно на самописной какой-то штуковине. HTML не радовал, CSS тоже. Приходилось немного переписывать для удобства, но это не важно. Важно то, что мы оговорили количество страниц (так как то был его сайт и он его знал), расположение элементов и поведение меню-гамбургера и открытие/закрытие корзины. В общем, сделала я это на день раньше срока, все работало, открывалось и выезжало. Потом он на день пропал, писал что занят, но после проверил проект и сказал "всё ок, мне нравится, но давайте тут немного...." И понеслось. Кнопочку подвинем на 5 пикселей, цвет полососчки поменяем, пусть корзина выезжает с другой стороны а лучше вообще сделаем ее не иконкой а пунктом меню. Далее выяснилось, что он мне дал не все страницы и на некоторых "дальних" страницах в которые трудно попасть не нажав 3-4 ссылки. Ладно, полчаса делов - дописать стили и переписать существующие. Я залила проект на живой сайт с его согласия, он что-то там клацал тыкал и взял и вернул старую верстку не предупредив меня. Я не успела сохраниться в git, но в блокноте страницы остались открыты - доделанную работу (новую) спасти удалось. Потом ситуация с "а давайте" повторилась раза 3-4, причем я ему говорила, что работа выполнена как и договаривались. Что-то менять отнимает у меня время, тем более срок проекта закончен. В итоге доделала согласно его просьбам, так как он не оплатил бы проект. Потом еще предлагал другие свои сайты, но мне не хотелось уже с ним работать. С сайта анкету удалила.

я там брала 1 заказ. могу рассказать как все прошло

"Если уж никак не отбрыкаться, лучше использовать woff и base64-встраивать его в css" - ну-ну погрожу пальчиком. Не base-64-четырнейтесь тут. .ttf - одного формата мало, хотябы .woff, .woff2 и .otf сгенерируйте.

http://howtocenterincss.com/ http://frontender.info/centering-css-complete-guide/

Странно. У меня переходит Тогда вот она - http://cs630718.vk.me/v630718120/77f9/I4u1osigqhU.jpg

Чо у гугла заскринила - http://joxi.ru/D2PBX7DsdpMKYr Они тоже люди человеки

Появились свои заготовки. Но не для всех макетов. Могу посоветовать HTML5 Boilerplate, но там структуры нет, просто несколько приятных мелочей.

Есть, я там брала один заказ, потом удалила профиль.

Привет. Я что-то занята очень и немного заболела. Я все прочитаю, но позднее.

Вплоть до пикселя - margin, padding, border-width и height/width. Шрифты вплоть до пикселя - только line-height и font-size. Отображение же его не меряю линейкой и не сверяю с макетом. Но наложение результата и макета для проверки - да, так как можно что-то упустить или верстая решить, что "да, так в макете примерно" задав значения для одинаковых по идее блоков, а они могут отличаться.

Может тут что есть http://stackoverflow.com/questions/17673156/instagram-share-photo-from-webpage

http://joxi.ru/V2Ve8MBS00R9gm- забыли потестить? Информации на главной мне было достаточно. При клике на пункт меню разные скорости у подпунктов и пункта - выпадает сразу список с белым фоном, а пункт уже позднее окрашивается Документация есть, но "edit this page" пугает http://joxi.ru/RmzgL6qhWWDpR2- не нравится http://joxi.ru/p27LXw5S00kOBA- нажатое состояние не очень http://joxi.ru/V2Ve8MBS00R1Xm- outline плохо, и он не только тут Чат не хотелось использовать

Извиняюсь, dobro , это ли не тестовое задание?

Да, стили я дописала. Фон плющит и картинки тоже, просто мне лень было прикреплять. Всем спасибо за участие, ничего не решилось особо

.trainer-block-wrapper:before,.trainer-block-wrapper:after { content: ''; position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}.trainer-block-wrapper:after { background-image: url(../img/media/trainer.png); background-repeat: no-repeat; background-position: 185px 16px; background-size: auto 100%;}.trainer-block-wrapper:before { background: url(../img/media/effect.png); background-repeat: no-repeat; background-position: -50px 0;}<div class="trainer-block-wrapper"> <div class="trainer-block"> <div class="trainer-content clearfix"> <h3 class="trainer-heading">ШЕВЧЕНКО СЕРГЕЙ ВЛАДИМИРОВИч</h3> <div class="trainer-text-wrapper"> <p> Основатель и руководитель международной организации Вин Чун Кунг Фу Ушу «Дом Вечной Весны». </p> <p> Дай Сихинг международной организации EBMAS (Emin Boztepe Martial Arts System) — ученик Эмина Бозтепа. </p> <p> Чемпион Украины по Ушу Саньда. Стаж занятий Ушу 25 лет, тренерский стаж 17 лет. </p> <p> Коуч и создатель оригинальной программы «Саморазвитие и самосовершенствование. Путь Вечной Весны». </p> <p> Автор методики физической и психологической реабилитации для детей с особенностями развития (аутизм, ДЦП). </p> </div> </div> </div> </div>Ссылка - http://wingchung.com.ua/web/index.html

В общем, надо задавать высоту. Труда не составляет, но обидно стало

Можно, скачав файл. Это при условии, что не преобразовали в кривые, а оставили шрифтом. В Corel Draw или Ai всё подскажут, какой шрифт.

Да, я подумаю еще. Просто интересен был такой вариант, но слева картинка, справа - текст, который может вытянуть колонку в 2 раза больше высоты картинки, а картинку в то время хорошо расплющит по высоте. Пару решений есть, спасибо.