Автор: Neil Lock

  • Какво, за бога, всъщност представляват шорткодовете?

    What-Are-Shortcodes-AnywayАко сте забелязали, едно от основните правила на WordPress е винаги, абсолютно винаги да прави нещата малко по-лесни за всички – както за начинаещите, така и за опитните разработчици. Един от начините, по които постигат тази цел, е чрез използването на кратки кодове (shortcodes).

    Страницата за поддръжка на WordPress.com ги дефинира по следния начин:

    shtЗвучи доста просто. Сега, ако не сте чували за кратки кодове преди тази статия и не знаете как изглеждат – те са онзи архаичен текст, наподобяващ код, ограден в квадратни скоби.

    В сравнение с нормалния код, който обикновено изглежда така:

    HTML5-video-tag-sample-code
    (Хм. Какво?)

    Кратките кодове като цяло изглеждат приблизително така:

    embed_shortcode
    (Фасулска работа.)

    …и ако сте разработчик (или дори просто човек, който се е докосвал до компютър поне два пъти), вероятно ще се съгласите, че самото писане и кликване за извършване на една незначителна задача може да отнеме много от времето ви. По същата причина, поради която имаме клавишни комбинации, кратките кодове съществуват, за да направят нещата по-лесни за всички нас, така че да спестим време, за да правим и създаваме по-добри неща; те много приличат на бързите клавиши по това, че имат абсолютно същата цел.

    Сега нека се върнем към този конкретен кратък код, същият като по-горе:

    embed-shortcode Този конкретен код се нарича кратък код за вграждане (embed shortcode) и е вграден по подразбиране в WordPress. Той вгражда видеото от URL адреса във вашето съдържание. Ако в момента сте в WordPress, можете да копирате и поставите горния кратък код в сайта си, ако искате да го изпробвате.

    Кратките кодове обаче не са съвършеното решение за пестене на време. В нашата предишна статия разглеждаме по-задълбочено защо кратките кодове имат своите недостатъци и какво подготвя екипът на Sandwich, за да ги отстрани.

    Засега обаче не се колебайте да експериментирате с кратките кодове и да видите какво точно могат да направят за вас.

    Приятно изграждане на сайтове!

  • Съпоставяне на кратки кодове: Как PBS ще поддържа 800+ добавки и 2000+ кратки кода

    How-PBS-Supports-800-Plugins-2000-ShortcodesWhen I started getting further into software development and WordPress, I noticed that not a lot of page builders I come across with have that “page builder standard” I was looking for: fast, easy, convenient.

    Page Builder Sandwich, then, was created with the goal of having a builder meet these same standards.

    I wanted- and still want it– to be the best page builder out there, and the best way I could accomplish that, I figured, was to add in features in a way in which page building becomes helpful and accessible to everyone –developers and noobs alike.

    I’d like to note though, that I didn’t simply create PBS with the intent of merely bombarding it with features just for the sake of it.

    I want to add in features that people would want to work with; features that hopefully, would make the experience of page building feel a little bit more like magic.

    През последните няколко седмици екипът на PBS добави елемент за карта, както и елемент за раздели (tabs).

    Сега би изглеждало като доста лесна и обикновена рутина за нас просто да добавяме по един нов елемент на всеки няколко дни.

    But I think it’d be better if we take it to the next level; to take a bigger leap, do something more drastic, something drizzled with a little more awesomesauce.

    And so we came up with an idea: “How about we start supporting 800+ plugins along with their 2000+ shortcodes?!?!”

    I know what you’re thinking: “How the heck can you support that much shortcodes? Is that even possible?”

    Well, the simple answer is yes. Yes it is.

    And we’ve managed to achieve this feat through shortcode mapping.

    What is Shortcode Mapping?

    Shortcode mapping
    Shortcode mapping makes building shortcodes more friendly.

    Put more simply, shortcode mapping is like letting Page Builder Sandwich memorize all the shortcodes available on your site: their names, descriptions, their attributes, and what each of these attributes do.

    Ползите от такава система са доста солидни:

    1.) Since PBS already knows what your shortcodes are, you get to spend less time going through the documentation of each plugin you use, and check how to use their shortcodes.

    2. ) In other words: Say goodbye to the grueling task of manually typing in your shortcodes!

    3.) With shortcode mapping, you can also say goodbye to manually checking post type ID’s. How? PBS can give you a list of all your contact forms through a drop-down list, so instead of looking for ID’s while on admin mode, you can pick from the list we made instead.

    4.) You’ll get to use dropdowns, colorpickers, image uploaders, and even number sliders when adjusting shortcode attributes.

    5.) Overall faster page building time!

    Съпоставянето на кратки кодове (shortcode mapping) обаче не е новост и много билдъри на страници вече разполагат с него. Но какво прави нашия по-различен?

    Как работи съпоставянето на кратки кодове в другите билдъри на страници

    Lonely times
    Each person/site does their own shortcode mapping.

    Other page builders have a dedicated admin page for shortcode mapping. You go inside your admin page, and then their admin page. You put in your shortcode, edit a number of text fields, then hit save. Finally, when you go to your page builder editor, the shortcode is now there in element list.

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

    What’s more, all your mappings only reside on your site. So when the times comes that you need to work on another site, you’ll have to copy your mappings all over again. Additionally, if and when you install a new plugin that has shortcodes, then you’re going to have to map those too.

    Как работи съпоставянето на кратки кодове в Page Builder Sandwich

    Shortcode mapping is centralized
    Shortcode mappings are shared across all users.

    Unlike the norm, shortcode mapping in Page Builder Sandwich is done on a global scale. The most used and popular plugins are gathered first, and all their shortcode mappings are created and updated in a central area. These will then spread out to all users depending on what they have installed. In other words, PBS studies and reviews all the shortcodes you have, including your activated plugins. Afterwards, it gives you the mapping of basically everything you need.

    Това ни дава множество страхотни предимства:

    1. Maximum coverage. Since we’ll be mapping out the shortcodes of the popular plugins, PBS will be able to support a majority of the shortcodes available on your site.
    2. Constant and frequent additions, updates and corrections. And since it’s in a central area, changes can be made quickly, and can be disseminated to all users.
    3. It basically works like magic. Let’s say you just installed a new plugin. Then you activate it, all mappings for its shortcodes will automatically get sent to you right away.
    4. Gone are the days when you have to personally map shortcodes yourself. PBS will do that for you.
    5. Your site remains lean and fast, and will only contain shortcode mappings that are relevant to you.
    6. Plugin zip size remains small. Even though PBS supports thousands of shortcodes, the plugin file size is still small. Your site and your backups remain small too!

    In case you’re interested in reading into how we made all of this possible,  we actually have a second part to this article in which things might start sounding a little more technical (if that’s your drift).

    Абонирайте се за нашия бюлетин!

    You can also opt to sign up to our mailing list, which will automatically notify you when we officially release this feature, (you can get future updates from us too, if you want). The shortcode mapping functionality will be out for our customers tentatively on August 12 August 15 2016. Not all shortcodes will be mapped by this time (our estimate is maybe 100 plugins), but mapping will be continuously done and customers will get them as soon as new ones roll out.

    So sign up to our newsletter to get news on shortcode mapping, when we’ll release it, and when we open shortcode mapping to the public! Until then, we hope you enjoy this new feature of ours, and that you have fun exploring it!

  • 5 прости съвета как уебсайтът ви да изглежда добре

    5-Simple-Ways-To-Make-Your-Website-Look-GoodIn general, one thing that most people tend to overlook is today’s demand for functional design and aesthetics. While not all of us may be aware of the extent of just how much it matters, the fact remains that design is a very crucial factor towards success—any kind of success– including your website’s. Yes, your content is an important key towards reeling your audience in, but how your site looks will definitely be a determining factor as well.

    Ето няколко основни съвета какво можете да направите, за да подобрите дизайна на уебсайта си.

    Add high-quality images

    You want to add the best quality images on your website that reflect your brand style, but if you don’t have a high-resolution camera or the money to pay a photographer, you can get free stock photos from sources like Pexels and Pixabay. Images should pertain directly to the content of your site. Including images is always better than no images at all.

    Изберете правилните цветове

    booneselections
    Lawrence Boone Selections uses black to add a sense of luxury and value to their website
    juicebox
    Juicebox used this zesty combination for people to get that organic and fresh that the brand represents

    Цветовата схема на уебсайта играе голяма роля в създаването на подходящия тон и настроение за вашия бранд. Изборът на хубав цвят не означава непременно, че той е правилният. Всеки цвят изпраща различно послание и реакция. Цветовете са едно от първите неща, които посетителите на сайта забелязват, и всъщност могат да повлияят на успеха на уебсайта ви.

    Изберете най-много два до три основни цвята за вашия дизайн. Ако почувствате нужда да добавите още цвят, можете да използвате светлите и тъмните нюанси на вашите основни цветове. В теорията на цветовете светлият нюанс (tint) е сместа на цвят с бяло, което увеличава светлостта, докато тъмният нюанс (shade) е сместа на цвят с черно, което намалява светлостта.

    Additional Tip: There are great tools such as Adobe Colour CC and Coolors to make picking colors easier.

    Използвайте контрастиращи шрифтови семейства

    Font Pairing There are more fonts other than Arial, Georgia and Times New Roman. Google Web Fonts offer a variety of typefaces you can use for free on your site. Just like with choosing colors you can easily over do fonts, so I suggest you do not use more than two typefaces on your website. Most well-designed websites use two typefaces only, one for the headlines and one for the body text.

    Съчетаването на две шрифтови семейства може да бъде трудно дори за дизайнери. Можете да опростите нещата, като експериментирате с два различни шрифта от едно шрифтово семейство. Ако е необходимо второ шрифтово семейство, изберете нещо, което контрастира добре с първото. Обикновено комбинирането на шрифт със серифи (serif) и без серифи (sans-serif) работи добре. Друг важен съвет е да избирате шрифтове, които отговарят на стила на вашата компания. Може да имате най-красивия шрифт на света, но използван в грешен контекст, той все пак може да изглежда ужасно.

    Поддържайте изчистен вид чрез празно пространство

    Whitespace is one of the easiest and most effective ways to create a visually effective website. Your website should look well organized and clutter free, directing users exactly where they need to go. Make sure elements stand out and are grouped together by using whitespace properly.

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

    People are probably going to visit your site at different times using different devices and screen sizes. While content is important, consistency across devices provides a better user-experience for anyone who visits your site. It makes it easier for users to share and link contents on your website to social media platforms on mobile. On top of that, Google prioritizes responsive websites on search results.

    Допълнителен съвет: Използването на Page Builder Sandwich на вашия уебсайт автоматично ще активира мобилния изглед и ще го настрои за размера на мобилния екран.

    Заключение

    Помнете: Подценяването на силата на дизайна е една от най-лошите грешки, които можете да направите, докато изграждате уебсайта си. Разбира се, не е нужно да полагате твърде много усилия при проектирането на сайта си, но междувременно простото следване на тези съвети може да гарантира, че сайтът ви няма да предизвика неодобрение от страна на вашата аудитория.

  • 5 причини, поради които бялото пространство има значение

    Reasons-Why-Whitespace-MattersНай-общо казано, празното пространство, според най-основното му определение, е пространството около и между всички елементи на една композиция, което е оставено незапълнено. То не е просто пилеене на екранно пространство, както смятат повечето собственици на уебсайтове. Когато се използва правилно, празното пространство всъщност може да осигури предимства за по-доброто промотиране на даден продукт. То е важен ключ към създаването на добър дизайн и прави уебсайта по-добър във всяко отношение.

    Въпреки че името „бяло пространство“ подсказва, че то е бяло, то не винаги трябва да бъде буквално бяло. Празното пространство всъщност може да бъде във всеки цвят — може дори да има фин мотив или текстура. Това е зона, върху която не искате окото да се фокусира. Нарича се още негативно пространство.

    И така, защо празното пространство е от значение?

    newsfeed
    Източник на изображението: News Feed

    Причина №1: Подобрява четимостта

    Празното пространство между базовите линии и абзаците всъщност помага на хората удобно да четат цялото съдържание на сайта. Коригирането на малки детайли на вашия сайт (като междуредието или разстоянието между буквите) може да доведе до огромна разлика и да улесни четенето.

    Целта е хората да искат да продължат да четат чрез проектиране на оформления, които са приятни за очите.

    hpmagicwords
    Източник на изображението: HP Magic Words

    Причина №2: Ускорява взаимодействието

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

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

    google
    Източник на изображението: Google

    Причина №3: Насочва вниманието към правилните елементи

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

    Помнете, че ако всичко се откроява, нищо не се откроява.

    Източник на изображението: Pocket Penguins

    Причина №4: Първите впечатления са от значение

    Външният вид и усещането на даден уебсайт са основният ключ към добрите първи впечатления. Добрите първи впечатления често водят до по-дълга продължителност на посещението. Твърде малкото празно пространство може да накара вашия уебсайт да изглежда евтин и ненадежден. Посетителите няма да смятат сайта или марката за надеждни, освен ако не изглежда привлекателно. Наличието на достатъчно количество празно пространство помага да се създаде правилният тон за вашия уебсайт. Празното пространство може да бъде начин да се изрази изобретателност, свежест, а понякога и елегантност.

    Съвет: Ето една идея как да направите своя уеб дизайн прост и познат.

    flockknitwear
    Източник на изображението: Flock Knitwear

    Причина №5: Помага за създаването на пространство за дишане и баланс

    Балансираният дизайн не означава симетричен. Един голям дизайнерски елемент може да бъде балансиран от няколко по-малки. Добавянето на празно пространство е чудесен начин да балансирате дизайнерски елементи с различни размери на вашата страница. Създайте плавен поток, така че погледът на потребителя да не се лута навсякъде. Добрият дизайн трябва да може да води потребителя от една точка до друга, без да го обърква.

    Заключение

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

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

    Крайната цел на всеки уебсайт е комуникацията. Визуалната привлекателност върви ръка за ръка с успеха на вашия уебсайт.

  • Добавянето на стилни карти към вашата страница е интерактивно изживяване

    Adding-Stylish-Maps-to-your-Page-is-an-Interactive-Experience-2Вече можете да поставяте карти в дизайните на страниците си с помощта на Page Builder Sandwich!

    Странно е човек да се вълнува от карти. Взимате URL адреса от Google Map и го вграждате. Или пък намирате плъгин за карти онлайн и поставяте шорткод. Или може би другият ви конструктор на страници вече има такъв и можете да добавите по всяко време. Но причината да сме развълнувани е, че издигнахме добавянето на карти на съвсем ново ниво.

    Ето предварителен преглед:

    Старият и скучен начин за добавяне на карта

    Ето как добавяте карта с обичайния конструктор на страници:

    1. Плъзгате нов елемент за карта,
    2. Въвеждате географската ширина и дължина в полетата,
    3. Въвеждате други стойности в полетата като височина на картата, ширина на картата, маркирате квадратчето за стил на пътищата и т.н.,
    4. Натискате предварителен преглед, проверявате как изглежда и решавате, че трябва да промените нещо, за да изглежда по-яко,
    5. Връщате се в конструктора на страници и променяте стойностите, след което повтаряте стъпка 4 по-горе.

    Начинът за добавяне на карта с Page Builder Sandwich

    Картите в уебсайтовете са интерактивни – можете да се движите по тях, да приближавате и отдалечавате. Затова си помислихме: защо да не премахнем всички предположения и просто да позволим на хората да взаимодействат директно с картата, докато изграждат страницата си?

    Ето как добавяте карта с Page Builder Sandwich:

    1. Добавяте елемент за карта,
    2. Въвеждате географската ширина и дължина или адреса, върху който искате да бъде центрирана картата,
    3. Движите се по картата и я приближавате или отдалечавате, за да постигнете желания изглед,
    4. Добавяте страхотни цветове към картите си, за да съответстват на вашия стил,
    5. Натискате запазване.

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

    Цветни карти или оформяне със SnazzyMaps

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

    Ето една, която тонирахме в розово:

    Page Builder Sandwich поддържа и по-сложни цветови схеми чрез SnazzyMaps. Те разполагат с огромен списък от цветови схеми, предоставени от потребители, и ви позволяват да създадете свои собствени, ако искате по-голям контрол върху цветовете.

    Просто намерете цветовата схема, която харесвате, след това вземете кода и го поставете в Page Builder Sandwich. Цветовата схема ще се приложи към картата ви веднага.

    Ето една страхотна цветова схема, наречена papuportal dark от SnazzyMaps:

    Поставяйте карти където пожелаете

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

    Ако все още нямате Page Builder Sandwich, можете да изпробвате премиум версията, като щракнете върху връзката „Live Demo“ по-горе.

  • Неизказаният проблем с шорткодовете

    The-Unspoken-Problem-of-Shortcodes

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

    Ако не знаете какво представляват кратките кодове и как изглеждат – те са онези архаични текстове, наподобяващи програмен код, затворени в квадратни скоби. Изглеждат приблизително така:

    Този конкретен кратък код се нарича embed и е вграден по подразбиране в WordPress. Той вгражда видеоклипа от URL адреса във вашето съдържание. Просто копирайте и поставете горния код във вашия сайт, ако искате да го изпробвате.

    Зад кулисите се случва следното: когато WordPress срещне кратък код във вашето съдържание, той се обработва и се преобразува в нещо друго. В горния пример, когато се открие кратък код

    , WordPress взема URL адреса в него и го проверява спрямо списък от доставчици на съдържание, с които разполага. Когато открие съвпадение, извлича съответния код за вграждане чрез iframe и показва него на това място.

    И така, какъв е проблемът тук? Звучи достатъчно лесно – просто въвеждате кратък текст със скоби и сте готови.

    Тук се появява Shortcode API..

    Изобилие от кратки кодове

    Shortcode API предоставя възможност на разработчиците сами да създават кратки кодове. Благодарение на това те могат да добавят свои собствени такива в плъгините си.

    Това е чудесно – сега само с кратък кодоподобен фрагмент както начинаещите, така и напредналите потребители могат да поставят практически всякакъв тип съдържание навсякъде, където поискат.

    По подразбиране WordPress съдържа само няколко кратки кода. Лесно е да ги изпишете по памет, защото са съвсем малко. Но ако инсталирате няколко плъгина, броят им бързо нараства до десетки, а в някои случаи и до над сто. Всеки кратък код има свой собствен набор от атрибути и инструкции за използване. Всеки плъгин най-вероятно разполага с някакъв вид документация за това как работят всички негови кратки кодове и описва наличните параметри за всеки от тях. Но би било безумно да се опитвате да запомните всички кратки кодове и техните атрибути.

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

    Някои се опитват да решат проблема

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

    Screen-Shot-2016-06-22-at-11.27.09-AM

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

    Screen-Shot-2016-06-22-at-11.28.54-AM

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

    Screen-Shot-2016-06-22-at-11.22.41-AM

    С други думи, всеки плъгин действа независимо и прилага собствено решение за собствените си кратки кодове. Някои плъгини добавят нов бутон до бутона „Добавяне на файл“ (Add Media), а други – директно в TinyMCE.

    Сега може би си мислите: „Защо просто да не съберем и кратките кодове на останалите плъгини и да ги включим в същото падащо меню / панел за избор?“. Е, точно това си помислих и аз. Но това е по-лесно да се каже, отколкото да се направи. Ще обясня защо след малко, но първо нека да видим как би изглеждало идеалното решение.

    Идеалното решение

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

    Представете си централно място, където всички ваши кратки кодове са събрани за лесен достъп. Всеки кратък код да описва какво прави и към кой плъгин принадлежи. За всеки наличен атрибут пък представете си да има етикет, удобен начин за избор на стойност и описание. Да ви се показват падащи менюта, инструменти за избор на цвят, радио бутони, превключватели и какво ли още не.

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

    Уловката

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

    Бележка към разработчиците: да, има новодобавен трети аргумент за функцията shortcode_atts, но той не е задължителен. Така че, освен ако всеки разработчик на плъгини в света не го приложи, все още няма да имаме сигурен начин за определяне на всички атрибути на даден кратък код.

    Shortcode API не предоставя никаква възможност за добавяне на описания на кодовете, определяне на типа на атрибутите или описания за тях. И освен ако самият WordPress не добави централизирано място за достъп до тях, съмнявам се такава възможност да бъде създадена.

    Заключение

    В момента задачата по организирането на кратките кодове е оставена на всеки отделен разработчик. Докато в рамките на WordPress не бъде разработен централизиран метод, очаквайте да продължавате да виждате множество бутони „Add Shortcode“ в административния панел. Дали подобно нещо трябва да бъде добавено в ядрото на WordPress, или не, е съвсем отделна и обширна дискусия.

    Алтернатива

    Съществуват плъгини за визуално изграждане на страници (page builders), които подхождат към това по различен начин. Вместо програмно да откриват кодовете, те разполагат с карти на кратките кодове (mappers), където потребителите могат ръчно да въведат всяка подробност. След като това бъде направено, кодът става достъпен в рамките на билдъра. Въпреки че  това работи, тези настройки са налични само във вашия собствен сайт.

    Ние тук в Page Builder Sandwich създаваме нещо, което се надяваме да разреши тази главоблъсканица с кратките кодове. Абонирайте се за нашия бюлетин по-долу, за да получавате известия за напредъка ни.

  • Защо WordPress?

    Why-WordpressЕдно важно нещо, което трябва да имате предвид при изграждането на първия си уебсайт – независимо дали сте бизнес, фрийлансър или просто всеки друг – е, че не всеки владее езика на програмния код и софтуерната разработка. Може например да сте готвач, който иска да публикува рецептите си онлайн. Може също така да сте студент по изящни изкуства, нуждаещ се от професионално изглеждащо портфолио, или стартиращ бизнес със собствен сайт. Без значение кой от тези случаи е вашият, остава фактът, че макар някои от нас да познават основите на програмирането, не всички сме разработчици на пълен работен ден и не всеки, който има нужда или желание за сайт, знае как да го създаде от нулата. Точно тук WordPress може да бъде от полза. Идва въпросът: „Защо WordPress?“

    ПРИЧИНА №1

    WordPress е система за управление на съдържанието, което я прави напълно удобна за потребителите.

    Първото нещо, което трябва да знаете, е, че WordPress е система за управление на съдържанието (или CMS). На по-прост език това означава, че WordPress позволява на своите потребители да създават уебсайтове, без да се налага да пишат код от нулата. Системата разполага с подреден и организиран интерфейс, който ви позволява постоянно да държите нещата под контрол, без да се налага периодично да променяте код.

    В сравнение със създаването на уебсайт от нулата, което обикновено започва така:

    screenshot-1 Със система за управление на съдържанието започвате с нещо подобно:

    WordPress
    Административният интерфейс на WordPress. Управлението и създаването на уебсайтове става по-лесно със CMS.

    Може обаче да си зададете въпроса: „WordPress изглежда чудесно, но какво, ако няма функциите, които искам за сайта си?“, или „какво, ако искам карта, музикален плейър, система за кеширане или по-надеждна сигурност?“

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

    ПРИЧИНА №2

    Разширенията: черешката на тортата на WordPress

    Ако се притеснявате, че WordPress не включва точно тази функция, която бихте искали за сайта си, спокойствие: вероятно я има.

    Разширенията са допълнителни функционалности, които служат за разширяване на възможностите на вашия сайт на WordPress. Ако сте предприемач и имате нужда от формуляр за контакт на сайта си, добре е да отбележим, че самият WordPress няма такава функционалност вградена, но има изобилие от разширения, които я осигуряват. И тъй като WordPress е с отворен код – което означава, че на практика всеки може да допринесе за развитието му – редовно се създават нови разширения. Получавате желания формуляр за контакт, както и много повече. Имате свободата да добавяте и други разширения – от бутони за споделяне в социалните мрежи до карти и дори допълнителни мерки за сигурност на сайта, наред с още множество функции и добавки. Звучи чудесно, нали?

    Към момента WordPress разполага с хиляди такива разширения – а някои от тях са напълно безплатни и/или имат безплатни версии, включително PBS.

    ПРИЧИНА №3

    Отворен код: общността на WordPress

    WordPress е с отворен код. Това означава, че всеки е свободен да допринася за развитието му, както и да изучава изходния му код, за да научи повече за софтуерната разработка и дори за самия WordPress. Съществуват дори бизнеси, посветени изцяло на създаването и разработката на продукти, свързани с WordPress, като например разширения и теми (като нас!)

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

    ПРИЧИНА №4

    WordPress се е доказал като стандарт.

    CNN, официалният блог на „Междузвездни войни“, списание Time и дори (ах!) Бионсе използват сайтове, задвижвани от WordPress, наред с много други. Тези големи имена не са единственото доказателство за авторитета на WordPress – според Treehouse.com около 25% от всички сайтове в мрежата работят с WordPress. Имайки предвид колко милиони сайтове съществуват… 25% е наистина впечатляващо число.

    ПРИЧИНА №5

    Богатство от възможности за персонализиране!

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

    ПРИЧИНА №6:

    Напълно безплатен е.

    Да, правилно прочетохте. Чрез локална среда за разработка WordPress е напълно безплатен и се инсталира на компютъра само с едно натискане на бутон. По същия начин, вместо да наемате разработчик, ще използвате наличните си познания по програмиране, за да научите повече за това как работи WordPress (а и ученето винаги е полезно).

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

    Помнете, че възможностите с WordPress са безкрайни и изобщо не е нужно да сте гений, за да разберете как функционира всичко!

    Използването на WordPress спестява много време, пари и усилия. А във време, когато тези ресурси са оскъдни, имайте предвид, че сайтовете на WordPress, техните разширения (като PBS!), темите им и особено неговата общност са насреща, за да ви помогнат и да направят нещата много, много по-лесни.

    Успешно създаване на уебсайтове!

  • WordPress.com срещу WordPress.org

    Wordpress-Com-VS-Wordpress-OrgАко сте сравнително нови в създаването на уебсайтове, има голяма вероятност да не сте запознати с големия дебат WordPress.com срещу WordPress.org. Може дори да не сте знаели, че съществува и другото, както и различните плюсове и минуси на всяко от тях. И така, какъв, моля ви се, е този голям дебат между използването на WordPress.com и WordPress.org? Дали едното не е просто евтино копие, което чака да бъде съдено?

    Е, не.

    Дебатът накратко е за това коя от тези две WordPress услуги е по-подходяща за уебсайта, който се опитвате да създадете. Нито едното не е плагиатство от другото и двата сайта са собственост на WordPress; просто едното (.com) е по-подходяща версия за хора без опит в разработката в сравнение с другото, а .org има много по-малко ограничения, що се отнася до изграждането на сайтове, в сравнение с .com.

    „Но как да разбера от кое имам нужда?“

    Отговорът на този въпрос изцяло зависи от нуждите на бъдещия ви уебсайт. Няма една конкретна WordPress версия, която да е обективно „по-добрата“ или дори „най-добрата“ за използване. И двете имат свои собствени уникални функции и равен брой плюсове и минуси.

    WordPress.com: Защо и кога да го избера?

    WordPress.com се грижи за основните неща вместо вас, което ви позволява да се съсредоточите повече върху съдържанието на сайта си. Това е платформа за изграждане на сайтове, която се управлява и хоства изцяло от компания, наречена Automattic. Получавате първокласен хостинг, резервни копия, сигурност и други подобни. Това означава, че можете да се фокусирате върху съдържанието на сайта си много по-лесно, в сравнение с това да прекарвате часове наред в изграждането му от нулата.

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

    Как да поддържате уебсайт е съвсем друга история. Това до голяма степен зависи от: 1.) не сте WordPress разработчик, 2.) нямате намерение да се учите да програмирате или 3.) имате малко или никакво време за това.

    WordPress.org: Кога е време да го обмислите?

    Едно общо правило, когато става въпрос за обмисляне на WordPress.org, е когато сте поне малко запознати с начина, по който работи кодът, или сте готови да отделите малко време, за да се научите. Тъй като WordPress.org е самохоствана версия на WordPress, можете да си изцапате ръцете колкото пожелаете. Освен това имате свободата да експериментирате и да правите промени толкова много или толкова малко, колкото искате. Вие ще отговаряте за намирането на собствен хостинг, за настройването на собствени резервни копия за сигурност и цялостното поддържане на уебсайта самостоятелно – и което е по-важно, според вашите собствени условия.

    „Но почакайте, защо бих искал това? Не е ли целта на WordPress да улесни създаването на сайтове?“

    …Не точно. Погледнете го така: The Daily Post прави отлична аналогия между WordPress.org и WordPress.com по начин, по който дори най-големите новаци (като мен) веднага разбират същината.

    Според тях трябва да мислите за WordPress.com като за нещо, върху което нямате пълна собственост. Представете си например вашето 15-годишно „аз“, което все още живее с родителите си. Ако искате да боядисате спалнята си, първо трябва да поискате разрешение от родителите си (които, разбира се, притежават цялата къща, включително и вашата стая). Технически стаята е ваша, но в крайна сметка, е… не точно.

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

    WordPress.org, от друга страна, е нещо, което можете свободно да персонализирате и настройвате по собствено усмотрение. Това може да се сравни с момента, в който най-накрая се изнасяте на 18 години и се сдобивате със собствен апартамент. Тъй като имате пълна собственост върху жилището си, не е нужно да правите компромиси с никого, за да боядисате стените си в онзи цвят, от който майка ви винаги се е ужасявала; имате свободата да вземете решението и/или да наемете някой, който отговаря на вашите изисквания, да го направи вместо вас. Освен това имате свободата да изберете точно кой климатик искате за хола си. Единственото е, че ако случайно се развали, ще трябва да наемете техник, който да го поправи, или сами да разберете какъв е проблемът и как да го отстраните (което не е толкова лошо, защото, хей, научен урок, а ученето е полезно нещо).

    До този момент се надяваме, че сте придобили по-ясна представа какви са съществените разлики между WordPress.com и WordPress.org. Но накратко:

    инсталирайте толкова много или толкова малко, колкото искате темите са ограничени само до теми на WordPress, трябва да платите определена такса, за да премахнете рекламите.Имате почти пълен контрол над сайта си; можете да добавяте, персонализирате или дори да създавате свои собствени теми.

    Контролът върху съдържанието е ограничен;

    WordPress.com WordPress.org
    Напълно хостван от WordPress; всички основни нужди са покрити. Самохостван; избирате свои собствени основни елементи или избирате по-добри.
    Функциите са ограничени до това, което предлага WordPress.com Хиляди функции под формата на плъгини;

    Това са част от сравненията при претеглянето на разликите между двете. Изборът между двете в крайна сметка се свежда до степента на свобода, която искате при създаването на сайта си, и колко ресурси (време, усилия, пари и т.н.) сте готови да отделите за това. Помнете, че това са много важни фактори за претегляне, преди да решите коя WordPress платформа ви подхожда най-добре. Затова не бързайте с решението!

    Приятно създаване на уебсайтове!

  • Как да създадете основни hero хедъри в 3 лесни стъпки

    How-to-Create-Basic-Hero-Headers-2

    061716_PBS_Jihan_How to Create Basic Hero Headers_Done

    When your dream website finally becomes a reality, the first thing you want your audience to know is what your site’s all about. The trick to reel them in is to give them a good but quick summary of your site’s content – and the easiest way to do that is by creating a Hero Header for your page.

    Какво представляват Hero хедърите?

    The purpose of the Hero Header is to visually communicate with your target audience in the fastest and most efficient way possible. You need to grab their attention quickly, in a way that it says: “Hey, this is my website, and here are the reasons it may be worth your time.”

    Typically, hero headers take up most of the space on the page, usually with large text and an equally large background image in order to give your readers a quick but firm-enough grasp as to what your website can offer them.

    За да започнете работа по първия си Hero хедър с PBS, следвайте бързите стъпки по-долу:

    Стъпка 1: Вмъкнете колона и коригирайте ширината на реда

    061716_PBS_Jihan_How-to-Create-Basic-Hero-HeadersClick 1 Column below the Insert Content tab on the inspector (that thing on the left/sidebar). Make sure your caret (the blinking cursor on the text box) is inside the text box.

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-1-b_Revised-1Under the Row Properties tab, you may change the background color in order to use it as a guide for the next steps. Change Row Width from Normal to Full-Width: Retained Content Width using the toggle button shown above.

    What’s the difference between Normal, Full-Width and Full-Width: Retained Content Width?

    Row Width-Normal

    Normal – Background, text and other elements are contained within the bounds of your current theme’s row width

    Row Width-Full-Width

    Full-Width – Background, text and other elements fill the entire width of your browser window

    Row Width-Full-Width Retain

    Full Width: Retained Content Width – Only the background fills the entire width of your browser window. Text and other elements are contained within the bounds of your current theme’s row width

    In this layout, Full Width: Retained Content Width is used because the text that will be applied is centered; not full-width.

    Стъпка 2: Регулирайте отстъпа, за да създадете бяло пространство

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-2-revisedIncrease the top and bottom margin by hovering the cursor on the arrow pointing to the margin you want to adjust. When the cursor turns into a double-headed arrow, click and drag down to your desired margin height. Its important to put Whitespace (also called Negative Space) between elements in a composition to create flow and help draw focus to the content on the page.

    Стъпка 3: Добавете фон с наслагвания от текст и елементи

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-3-aTo add a background image with text and element overlays, simply click the Background Image icon under the Row Properties tab, upload your desired background image, and select to apply.

    061716_PBS_Jihan_How to Create Basic Hero HeadersTip #1: For Premium users, using the Background Image Tint option, helps to provide more contrast for text, buttons or other elements. You can select a tint color and adjust its value by clicking on the Background Color icon. Both icons can be found under Background on the Row Properties tab.

    061716_PBS_Jihan_How-to-Create-Basic-Hero-Headers_Step-3-cType in the message for your header. See Text Formatting tab to adjust the style. Choose typefaces that are easy to read and goes well with the background image. Remember to show contrast from the background image.

    Съвет №2: За брандинг елементите помислете за използване на бяло или черно лого, за да не се сблъсква с цветно фоново изображение.

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-3-dYou can also add buttons by clicking on Button below the Insert Content tab.

    Не забравяйте да запазите работата си и сте готови!

    Поздравления за създаването на първия ви Hero хедър с PBS! Ако все пак не се е получило, няма място за притеснение; започването от нулата може би е дори по-лесно с PBS, така че няма да е особен проблем.

    Приятно създаване на уебсайтове!

  • 3 неща, които да обмислите, преди да се впуснете в конструкторите на страници

    3-Things-to-Consider-Before-Diving-Into-Page-BuildersИма вероятност да сте тук, защото сте чули, че PBS е напълно възможно един от най-бързите преки пътища за изграждане на уебсайт. Въпреки че билдърите на страници като цяло съществуват, за да улесняват нещата, все пак има няколко неща, които може да искате да вземете предвид, преди да се потопите по-дълбоко в тази конкретна сфера на разработката с WordPress.

    Изучаването на WordPress: Важно предварително условие за билдърите на страници

    Това вероятно е най-очевидната точка в този списък, но все пак е най-важната. За съжаление, билдърите на страници не се продават самостоятелно. Те идват под формата на плъгини в WordPress, които ще трябва да инсталирате и изучите, за да работите с тях. Бъдете сигурни, че WordPress е един от най-лесните и легитимни начини за създаване на уебсайт. Няма да съжалявате, че разбирате от нещо техническо, като се има предвид епохата, в която се намираме. Има разлика между WordPress.com и WordPress.org, а това да знаете кое отговаря на вашите нужди също спестява време!

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

    Може би ще искате първо да опипате почвата, просто за да сте сигурни

    Винаги е добра идея да изпробвате безплатните и/или пробните версии, преди да правите големи покупки, за които може накрая да съжалявате в бъдеще. За щастие, повечето билдъри на страници се предлагат с безплатни/демо версии. Разбира се, можем да разгледаме и множество надеждни ревюта за билдъри на страници, докато други сравняват и съпоставят билдърите на страници.  Уверете се, че внимателно преценявате възможностите си!

    Освен преглеждането на статии и отзиви, едно от нещата, които харесваме в WordPress, е огромната общност зад него. Има отделни хора, екипи и дори компании, готови да подадат ръка на своите колеги потребители на WordPress, особено на нови като вас! Общността основно работи на принципа „предай нататък“, а не просто „вземи и дай“.

    Дизайнът прави огромна разлика

    WordPress ентусиастката Дона Фонтено Кавалие изтъква много добър аргумент относно drag-and-drop билдърите на страници и важността на базовия дизайн. Докато drag-and-drop билдърите като PBS могат да ви спестят много време, базовите познания и поне известна запознатост с естетиката са друго критично важно нещо, което трябва да вземете предвид при създаването на уебсайтове. Представете си сценарий – да речем, че се сдобиете с удобен билдър на страници по ваш избор: това е страхотно! Но след това да речем, че сте човек, който няма точно най-доброто око за изкуство, дизайн и функционалност: опа.

    Не се притеснявайте обаче. Page Builder Sandwich не е просто билдър на страници; нашият екип също така е отдаден на това да помага и на други потребители на WordPress. Така че, ако срещате известни затруднения относно дизайна, не се тревожете – имаме куп статии тук в блога на PBS с много полезни съвети, които да ви помогнат да започнете. По този начин ще постигате повече, ще научавате повече и ще се тревожите по-малко.

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

    Приятно създаване на сайтове!