Започнете от тук

Стайлинг

Нека започнем със стилизирането на шаблона.

Цветове

Шаблонът Web3 X е изграден с помощта на цветови променливи, което означава, че можете лесно да редактирате цветова променлива, която да бъде актуализирана в целия сайт.

За да направите това, просто трябва да отидете в раздела "Стил" в дясната странична лента, след това да превъртите до "Цветове" в раздела "Типография" и ако кликнете върху цвета, ще можете да видите всички цветови мостри и да ги редактирате, за да бъдат актуализирани в целия сайт до всеки необходим цвят.

Шрифтове

Шаблонът Web3 X използва един-единствен шрифт за цялата страна и е настроен в селектора Body (All Pages ), което означава, че можете лесно да актуализирате шрифта за целия сайт с едно кликване.

В която и да е страница кликнете върху оранжевата опция за избор в горния десен ъгъл на раздела "Стил", след което изберете " Тяло (всички страници)". След като сте направили това, можете да отидете в раздела Типография по-долу и да промените шрифта на произволен шрифт за вашата бизнес марка.

В случай че ви е необходим потребителски или премиум шрифт, който не е наличен в Webflow, винаги можете да отидете в Настройки на проекта > Шрифтове и ще можете да качите потребителски шрифтове или да свържете акаунта си в Adobe Fonts.

Графики и икони

Някои икони или графики в шаблона са нормални изображения/графики, така че при актуализиране на всички цветове те ще продължат да имат цвета на шаблона.

Това се случва, защото тези графики са изображения (PNG, JPG, SVG и др.), така че актуализирането на CSS (стилизирането) на Webflow няма да им повлияе. Ако искате да използвате тези графики повторно, винаги можете да ги изтеглите и да ги редактирате с помощта на софтуер за дизайн (напр. Photoshop, Illustrator, Sketch, Figma и др.) или директно да качите свои собствени изображения/графики, които съответстват на вашата марка.

Статични страници

Статично съдържание е цялото съдържание, което не е базирано на CMS, което означава, че не е динамично (като публикация в блога например).

Можете лесно да идентифицирате цялото това съдържание, тъй като то е показано в сив цвят в навигатора в лявата странична лента и има синя рамка, когато кликнете върху него или го поставите с мишката.

Ако искате да редактирате този тип съдържание, можете просто да щракнете два пъти върху него и ще можете да въвеждате директно там.

Динамично съдържание (CMS)

Динамично съдържание е цялото съдържание, което е динамично и се генерира автоматично въз основа на съдържанието, добавено в раздела CMS в лявата странична лента (точно под иконата Страници).

Можете лесно да идентифицирате всичко това, защото то е показано в лилаво в навигатора в лявата странична лента и показва лилава рамка, когато кликнете върху него или го поставите с мишката.

Това съдържание трябва да се актуализира директно в раздела CMS. Това има за цел да ви улесни много при актуализирането му, тъй като е много вероятно то да се налага да бъде постоянно актуализирано (например добавяне на нова публикация в блога).

Също така, ако искате да редактирате цяла автоматично генерирана CMS страница (например публикация в блога), ще намерите тази страница на разположение за редактиране в долната част на всички страници в раздел Страници в лявата странична лента.

Продукти (електронна търговия)

Продуктите или съдържанието за електронна търговия функционират по подобен начин на динамичното съдържание на CMS, но са насочени изключително към продуктите за електронна търговия.

Можете да разпознаете съдържанието за електронна търговия по подобен начин на съдържанието на CMS, тъй като то също се показва в лилаво в навигатора в лявата странична лента, както и с лилава рамка, когато кликнете върху него или го поставите с мишката.

Това съдържание трябва да се актуализира директно в раздела за електронна търговия в лявата странична лента. Това има за цел да ви улесни много в актуализирането му, тъй като е много вероятно то да се актуализира постоянно (например промяна на цената на продукта или добавяне на повече наличности).

Също така, ако искате да редактирате автоматично генерираната страница за електронна търговия с продукти, ще намерите тази страница на разположение за редактиране почти в долната част на всички страници, точно над страниците на колекцията CMS.

Полезни бележки

Освен основното обяснение, което споделихме по-горе, тук ще споделим няколко съвета и указания, които са част от най-често задаваните въпроси.

Взаимодействия

Ако искате да редактирате някой шаблон Взаимодействие (напр. премахване на ефект на появяване), можете лесно да идентифицирате елементите, които имат взаимодействия, тъй като те имат малка икона Взаимодействия (малко гръмче) в навигатора в лявата странична лента.

Ако щракнете върху тази малка икона "Взаимодействия", ще се отвори десният страничен раздел "Взаимодействия" за този елемент, където можете да редактирате взаимодействието.

Преглед на мобилни устройства или таблети

Всеки път, когато правите промяна (например създавате нов дизайн на раздел), е добре да отидете в горната навигация на Viewport и да видите как изглежда на таблет и мобилно устройство.

Ако редактирате само раздел на шаблона с актуализиран текст или изображения и не изтривате нито един клас на шаблона, това не би трябвало да е необходимо, но ако персонализирате шаблона по-дълбоко, редактирате класове или създавате нови раздели, винаги е добре да редактирате постоянно изгледите за мобилни устройства и таблети, за да сте сигурни, че всичко изглежда перфектно.

Редактиране на Meta Title, Desc и Featured Image

Ако желаете да персонализирате заглавието, описанието и изображението, които се показват, когато споделяте уебсайта си на някое място (напр. във Facebook, Twitter и др.), можете лесно да отидете в раздела Pages (Страници) в лявата странична лента, да кликнете върху малката икона Settings (Настройки) на страницата, която желаете да персонализирате, и всички тези настройки ще се появят.

Моля, обърнете внимание, че е важно да променяте това на база страница.

Резервни копия

Ако нещо се обърка, например ако не ви харесва накъде отива уебсайтът, ако сте изтрили някои критични класове, които са били необходими, за да изглежда шаблонът добре, или ако просто искате да се върнете към предишна версия по някаква причина, винаги можете да отидете в раздела Резервни копия.

Можете да го намерите в раздела Настройки в лявата странична лента и след това да видите всички автоматични или ръчни резервни копия. Възстановяването на старото резервно копие е само на едно щракване.