Page Builder Sandwich

Ottieni PBS Pro

Autore: Neil Lock

  • 4 errori di web design che devi evitare nel 2018

    If there’s one thing you need to remember when building a website, it’s to never take good design for granted.

    As we’ve mentioned in a previous article, a site visitor’s first impression on your website can make or break you in just a matter of seconds.

    In other words, if they don’t like what they see within that timeframe, chances are they’re going to close their browser windows and direct their attention elsewhere.

    Fortunately, there are a lot of ways to prevent this from happening; one of them is to familiarize yourself with good web design practices. And the good news is you don’t need to be a professional web designer in order to do so.

    Because while it’s true that not everyone has a good eye for design, preventing bad design becomes easier once you know what to avoid.

    Detto questo, assicurati di tenere a mente questi 4 errori comuni di web design. In questo modo, avrai una preoccupazione in meno quando inizierai finalmente a creare il tuo sito web.

    Errore n. 1: utilizzare più di 3 font

    A rule of thumb when designing websites? Try not to have too much visual elements going on within your space. Having more than 3 fonts on your site design is a surefire way to break this one rule. It’ll also overwhelm your site visitors.

    Limitare i font del tuo sito web a un massimo di 3 è una pratica generale di design seguita dai professionisti. Inoltre, aumenta il livello di leggibilità e coerenza del tuo sito, elementi chiave per il successo del tuo traffico.

    DON’T DO THIS:

    Don’t use more than 3 fonts and try to avoid “fancy fonts” as much as possible. These tend to make your site look unprofessional and outdated.

    DO THIS:

    Use only 2 fonts, or a maximum of 3 if you have to. Notice how the page below looks clean and sleek, all while keeping readability and consistency all throughout the design.

    Try comparing the differences between this example and the previous one. The example below with only two fonts is a website that your visitors will likely take seriously.  This previous one above with the overwhelming amount of fonts isn’t.

    Mistake #2: Failing to Use White Space

    White space is one of the most important aspects of web design. But what is it?

    Put simply, white space is literally the empty space between elements in a composition.

    In other words, it’s negative space. This pertains to anything on your website that isn’t filled with text, photos, or other design elements.

    Now, the problem arises when website owners want to fill all of the white space in, which is an absolute no-no.

    White space matters because it gives your site visitors and readers some breathing space when going through your site. Just how it was mentioned in the first design mistake to avoid, overwhelming your website with too much design elements is more than enough reason for your site visitors to leave and for your traffic to decrease significantly. It also makes for poorly executed design.

    DON’T DO THIS:

    In the example below, take a look at how the text is nearing the edges of the purple section’s margin. Notice as well how all elements leave almost zero room for white space.

    DO THIS INSTEAD:

    Give your site readers some room to breathe. If adding in long paragraphs is unavoidable, just remember to always take the rules of spacing into account—they’re pretty easy to remember anyway ?.  It will leave your page looking cool, crisp, and professional.

    Mistake #3: Designing Websites With Zero Flow in Your Site’s Content

    It’s important to pay attention as to how  information on your website is presented. Moreover, site content should generally follow a logical flow, taking the site viewer’s intuition into consideration.

    Dai un’occhiata ai due esempi qui sotto per capire cosa intendiamo.

    DON’T DO THIS:

    Unless you’re a graphic designer by profession, it’s probably not a good idea to experiment with the standard flow of your website’s sections.

    Below, you can see that the site’s design lacks both visual and logical flow; everything is all over the place. You don’t want your audience having a hard time navigating through your site, either. This is another surefire way to do it.

    DO THIS INSTEAD:

    Notice how the sections of the website flow depending on what actions the visitor is most likely to take.

    Il design è intuitivo e presenta un flusso logico: in primo luogo, l’organizzazione si presenta e informa il pubblico sugli aspetti fondamentali, come la sua missione e le sue attività. In secondo luogo, inserisce dati affidabili per stabilire credibilità. Infine, il sito web fornisce al pubblico i numeri di contatto e un elenco di eventi, spingendolo ad agire.

    Mistake #4: Trying to Fit in Every Bit of Information Onto Your Website

    Aggiungere muri di testo non necessario dove invece dovrebbe esserci spazio bianco può allontanare il tuo pubblico. Ricordati di mantenere solo i dettagli importanti.

    Studies find that readers only visit 20% of your webpage; everyone else outside that percentage will probably just scroll through your site.

    DON’T DO THIS.

    Don’t overwhelm your visitors with inconsistent, giant walls of text, especially if it means having to sacrifice your website design’s cohesiveness and structure.

    DO THIS INSTEAD:

    Keep your copy short and concise, and take out chunks of unecessary text if you can help it. Only keep vital information that your site visitors absolutely need to know.

    Conclusion

    Website design is important, and can be a huge deciding factor in whether or not you gain site traffic.

    Ricorda di non darlo per scontato. Dedica sempre del tempo alla ricerca e consulta articoli di design che possano guidarti lungo il percorso. Prima che tu te ne accorga, vedrai il traffico del tuo sito crescere. ? Buona fortuna!

    Design in less time!

    Check out how much faster Page Builder Sandwich let you design your web pages.

    Try Live Preview

    This week’s useful resource:

    CANVA has hundreds of resources that you can access on their website. Apart from useful and easy-to-follow design tips, they also have photo editing tools, graphs, and a wide range of useful resources you can use for your creative projects.

    Dai un’occhiata a questa fantastica Guida ai colori di Canva per il tuo prossimo progetto di design.

    Canva Design Wiki

    Libera la tua creatività.

    Dai un’occhiata alla Guida ai colori di Canva

  • #PBSUpdate: Aumento delle prestazioni del 200% e nuovi elementi

    Only a few weeks ago, we released PBS Version 4.1. This update included tweaks on the formatting bar and some text formatting updates, among others. For Version 2.0 though, while we made additional features, we decided to focus more on PBS’ overall performance.

    200% Performance Increase & A Little Help from CodeInWP

    A stimolare questo cambiamento è stato un articolo sulle aspettative per i page builder di CodeInWP. Conteneva un breve elenco dei loro preferiti, esaminandoli ciascuno secondo criteri specifici. Sebbene Page Builder Sandwich non sia entrato nella lista vera e propria, siamo stati comunque menzionati brevemente nell’articolo:

    With Page Builder Sandwich you won’t also lose your content and will be able to continue updating the page easily via a default WordPress editor.

    Leggere questo è ciò che ha spinto il nostro team a migliorare ulteriormente PBS. E, dato che non eravamo inclusi nella lista, eravamo al tempo stesso curiosi di scoprire quali fossero le nostre carenze specifiche. Poco dopo abbiamo contattato CodeInWP per chiedere una breve recensione di PBS, e l’autrice ospite Ann Taylor ci ha fornito una risposta molto costruttiva e utile:

    “…I played around with a free version a bit. It shows a lot of promise: lots of modules, pretty intuitive UI, great WYSIWYG experience, everything is dragged around easily. However, when I had around 10 modules on the page, it became hard to continue working with it because of low editing speed…”

    Questo ottimo feedback ci ha spinto ulteriormente a indagare sulla velocità e sulle prestazioni di PBS. Abbiamo testato molti scenari diversi e riscontrato enormi colli di bottiglia nella velocità. La causa principale dei problemi di prestazioni erano i vari calcoli che il plugin eseguiva per mostrare contorni, barre degli strumenti e altri elementi visivi dell’editor. Di seguito è riportato un grafico delle prestazioni di PBS versione 4.1 in Chrome:

    Here are the important points of the graph in a nutshell:

    • Le aree viola alte non vanno bene
    • Le aree viola larghe sono peggiori
    • Abbiamo velocizzato molto le cose, e ora il nostro grafico per la versione 4.2 ha questo aspetto:

    If you compare the tall and wide purple areas from the two graphs, that means that we have achieved a 200% performance increase!

    4 New Elements

    Ciò che preferiamo di questi 4 nuovi elementi è che permettono di creare intere sezioni di pagine web in modo rapido ed efficiente, senza la necessità di trascinare gli elementi nell’area di lavoro di PBS uno a uno. Vi daremo anche la possibilità di scegliere tra diversi stili, così avrete più margine per personalizzare questi tre nuovi elementi in base alle vostre esigenze di design.

    Spacer Element

    È facile regolare i margini degli elementi per ottenere lo spazio necessario. L’elemento distanziatore può essere utilizzato come alternativa. Questo è particolarmente utile se desideri che determinate righe non si rimpiccioliscano troppo sugli schermi dei dispositivi mobili.

    Featurette Element

    L’elemento featurette può essere utilizzato per creare sezioni della pagina più rapidamente. Queste sezioni possono includere hero header, caroselli di testimonianze e altri elementi utili per migliorare la funzionalità della pagina.

    Since all of the Featurette Elements are pre-designed, all you’ll have to do is simply drag the “Featurette” button from the Elements Tab, and choose what you want to add on your workspace from there.

    Team Members Element

    L’elemento membro del team è perfetto per presentare i membri del tuo team ai visitatori del sito. In genere, una sezione di questo tipo include la foto di un membro del team, nonché una breve descrizione in basso.

    Gallery Element

    Questo elemento viene utilizzato per creare gallerie fotografiche. In precedenza, dovevi trascinare singoli elementi (come pulsanti, cornici, ecc.) nell’area di lavoro di PBS uno a uno per creare una galleria. Questo nuovo elemento fa tutto al posto tuo, rendendo il processo senza problemi.

    A Huge Thank You

    La versione 4.2 è uno dei nostri aggiornamenti più importanti fino ad oggi. Dopotutto, prestazioni e funzionalità sono fondamentali per qualsiasi ottimo plugin. Vorremmo ringraziare @Ann Taylor e CodeInWP per averci fornito feedback costruttivi e averci augurato buona fortuna per il nostro percorso. E a tutti gli utenti di PBS, un enorme grazie anche da parte nostra per il vostro continuo supporto.

    Rilasceremo presto altri aggiornamenti (inclusa la funzionalità promessa per Google Fonts, tra le altre), quindi restate sintonizzati!

    Fino ad allora, buona creazione di siti dal Team PBS!

  • Come personalizzare autonomamente le sezioni predefinite di Page Builder Sandwich

    We’ve been getting quite a few inquiries the past week about Pre-Design Sections (and by extension, the PBS Templates), what they are, and how they can be accessed.

    So in this article, we’ll be teaching you how to not only access them, but also how to maximize these features of Page Builder Sandwich: By customizing them and making them your own.

    Accessing the Pre-Designed Sections

    If you aren’t familiar yet, all you have to do to access the Pre-Designed sections is to hover your mouse onto the left side of your screen, and access the Elements Inspector. This is the sidebar that lets you drag and drop elements directly onto your content area.

    Say hello to the Elements Inspector!

    Once it’s accessed, simply scroll down to the bottom and select Pre-Designed Sections. A library of the sections will pop up. Select one from the collection, drag and drop, and it’ll show up on your content area, like so:

    From here, you can move the elements within the section around, or move the entire thing and adjust its position. And there you have it! You’ve selected a Pre-Designed Section from Page Builder Sandwich.

    Now it’s time to add in your own twist: By customizing and tweaking with the elements’ settings within the selected section.

    Customizing the Pre-Designed Sections

    Each element’s setting within any one Pre-Designed section can be edited and customized according to your website’s needs and your personal taste.

    This means everything included in your selected Pre-Designed section – like text, colors, images, buttons, everything – can be edited and tinkered with by you.

    Quindi, ad esempio, se non sei soddisfatto della tonalità blu-verde predefinita e dell’immagine del campo di grano nella sezione predefinita Pre-Designed qui sotto…

    You can adjust it. For instance, if I wanted a different background tint on the left:

    Or if you wanted to replace the image of the wheat field on the right:

    Or even change the button style, margin, padding, and font:

    …You can.

    Per fare un confronto:

    Default PBS Pre-Designed Section

    The same Pre-Designed Section, completely tweaked and customized. Notice the different font, color scheme, button style, photo, and margin width. You can actually take this further, and let your imagination run wild.

    Here are a few more examples on how you can spice up our Pre-Designed Sections

    Default Pre-Designed Section from Sandwich

    The same Pre-Designed Section, customized

    You can do it with our Full-Page Templates, too:

    Default Template from Sandwich

    The same Template, customized

    Conclusion

    Le Pre-Designed Sections di Page Builder Sandwich offrono molto più di quanto pensi.

    Tweak and customize them to make them completely your own, or even use them as a starting point for when you don’t want to design your page from the ground up.

    Ricorda, Page Builder Sandwich è qui per aiutarti a progettare in meno tempo. Sfruttare al meglio le nostre Pre-Designed Sections e i Full Page Templates ti aiuterà proprio a fare questo.

    Design in less time!

    Get access to Sandwich’s Pre-Designed Sections, Templates, and a whole lot more.

    Try Live Preview

  • Versione 3.0: Ripensare come dovrebbe funzionare un page builder

    version-3-0-rethinking-how-a-page-builder-should-workSono passati 10 mesi da quando abbiamo lanciato Page Builder Sandwich al pubblico. Ora abbiamo circa 6.000 installazioni attive, e questo è un bel traguardo per noi. Abbiamo anche ricevuto una valanga di feedback grazie a ciò, sia positivi che negativi. Il consenso generale, tuttavia, è che le persone apprezzano quanto sia facile creare layout e realizzare i propri contenuti rispetto agli altri page builder disponibili sul mercato.

    Gran parte dei feedback ricevuti riguardava richieste di funzionalità, e ne abbiamo aggiunte molte negli ultimi mesi. Ma continuando a farlo, stavamo anche iniziando lentamente a cambiare l’interfaccia utente nel processo. E, di conseguenza, stavamo anche cambiando l’esperienza utente… in peggio. Si era arrivati al punto, però, in cui avevamo bisogno di ripensare l’interfaccia, perché semplicemente non funzionava più in modo fluido e le diverse funzionalità non si integravano bene tra loro.

    La vecchia interfaccia

    Nelle versioni precedenti di PBS, volevamo che tutto avesse la forma di pulsanti. Perché? Perché i pulsanti sono facili da usare. Basta… cliccarci sopra. Nelle versioni precedenti dell’inspector (la barra laterale nell’immagine sopra), facendo clic su un pulsante si aumentava un valore, mentre facendo Maiusc+clic su un pulsante lo si diminuiva. Sembra abbastanza semplice. Ma con l’aggiunta di caroselli, schede, mappe e altri nuovi elementi e funzionalità, tutti quei pulsanti sono diventati un miscuglio di icone diverse con design differenti, e hanno iniziato a sembrare più geroglifici che un’interfaccia accattivante. Questo non era un problema per gli utenti esperti, ma è piuttosto intimidatorio a vedersi se si è nuovi su PBS.

    In secondo luogo, sono emersi un paio di problemi nell’inspector. L’idea originale era quella di rendere tutto semplice e disponibile all’interno dell’inspector. E con tutto, intendevo tutto – dal trasformare il testo in intestazioni, al cambiare i colori di sfondo, i colori dei font, e quant’altro. Nel suo stato attuale, tuttavia, l’inspector ora contiene molte opzioni che costringono a usare continuamente la rotellina del mouse per scorrere verso l’alto e verso il basso. Molto diverso dall’inspector che originariamente speravo di creare per gli utenti.

    Infine, abbiamo recentemente introdotto la mappatura degli shortcode per i tuoi plugin preferiti. Questa funzionalità ci ha richiesto di creare campi di testo, cursori numerici, caselle di controllo e ulteriori nuovi tipi di opzioni necessari per rendere più piacevole la tua esperienza di modifica degli shortcode. Inizialmente era una buona idea e sì, ha reso più semplice la gestione degli shortcode per te. Ma ancora una volta, questa funzionalità si allontanava dalla nostra interfaccia “a soli pulsanti”. A posteriori, era davvero impossibile utilizzare solo pulsanti per modificare gli attributi degli shortcode. Ora, nell’ultima versione, ci siamo ritrovati con 2 tipi di controlli: i pulsanti e i campi degli shortcode.

    Ci sono altri motivi che ci hanno spinto a decidere che la nostra interfaccia non era più efficace (o adatta alle nostre esigenze), ma i punti precedenti sono i principali. Una cosa però è sempre stata certa: sapevamo di dover aggiornare l’interfaccia.

    Definire come dovrebbe idealmente funzionare un page builder

    Invece di gettarci a capofitto e cambiare le cose immediatamente, abbiamo fatto cento passi indietro per dare un’occhiata all’intera esperienza del page builder. Volevamo dare nuova vita all’interfaccia. In tutta sincerità, non volevamo continuare a ricostruirla anno dopo anno. È estenuante e sicuramente non porta un aiuto significativo alla community di WordPress. Questa volta, abbiamo deciso di fare le cose lentamente e con attenzione. Abbiamo studiato ogni angolo di Page Builder Sandwich e ciò che lo rende un buon page builder, e alla fine abbiamo sintetizzato l’intera esperienza di modifica in alcuni concetti fondamentali.

    Concetto fondamentale n. 1: digitare direttamente nei tuoi contenuti per modificare le cose

    Uno dei motivi principali per installare un page builder è liberarsi dai vincoli dell’editor di testo backend di WordPress. Non che l’editor backend non sia valido, ma durante la creazione delle pagine web, non mostra immediatamente come apparirebbe la tua pagina web ai visitatori del sito, né ti consente di impaginare i tuoi contenuti al di fuori di un layout a colonna singola. Lì puoi vedere solo il tuo testo e alcune immagini, ma nessuno degli elementi più elaborati (ad es. i moduli di contatto). Puoi aggiungere shortcode, sì, ma non verranno mostrati nella loro forma renderizzata*.

    * Esistono plugin creati da altri per ovviare a questo problema, come Shortcake UI, ma questo è un altro discorso.

    È qui che entrano in gioco i page builder frontend. Portano l’esperienza di modifica fuori dal backend e dentro al frontend, con te che modifichi il tuo sito esattamente nel modo in cui lo vedrebbero realmente i tuoi visitatori. Come direbbe Pippin: What you see is what you get (ciò che vedi è ciò che ottieni – WYSIWYG).

    Un altro vantaggio dell’essere un editor frontend è che ti consente di modificare il testo direttamente. Digitare intestazioni e paragrafi offre la comodità di utilizzare il consueto elaboratore di testi nella creazione di siti web. Anche i pulsanti e le etichette delle schede dovrebbero poter essere modificati semplicemente cliccandoci sopra e digitando.

    Questo è il settore in cui la maggior parte degli altri page builder non offre prestazioni ottimali. La maggior parte di essi ti costringe a digitare all’interno di un campo di testo per modificare qualsiasi cosa. Anche in questo caso, non dovrebbe essere così nei veri page builder frontend. Digitare e modificare il testo direttamente è stato un punto di forza di Page Builder Sandwich sin dalla versione 2, e ci siamo assicurati che questo principio venisse mantenuto anche nella versione 3.

    Concetto fondamentale n. 2: utilizzare il mouse per modifiche rapide

    Il mouse è uno strumento potente che viene spesso trascurato nei page builder. Spesso i page builder lo utilizzano per consentire alle persone di trascinare gli elementi e rilasciarli in posizioni diverse, oppure per fare clic su pulsanti o campi di input. Sebbene ciò vada bene, c’è molto di più che puoi fare con il mouse in termini di creazione di pagine.

    Per prima cosa, c’è un fantastico feedback visivo nell’usare il mouse come strumento per modificare la pagina, soprattutto nella regolazione di proprietà visive come margini, padding e dimensioni. Ora, modificare i tuoi elementi diventa un’esperienza naturale.

    In PBS versione 3, potrai regolare una serie di cose usando il mouse. Puoi regolare margini/spaziature tra singoli elementi, i padding all’interno delle tue colonne, nonché le dimensioni di immagini, icone e mappe. Abbiamo anche sostituito con dei cursori i pulsanti che consentivano di modificare i valori numerici.

    Concetto fondamentale n. 3: il testo dovrebbe essere facile da formattare

    Se fai un passo indietro rispetto al tuo monitor, noterai che la maggior parte di ciò che aggiungi nelle tue pagine web sono contenuti testuali. Sì, abbiamo immagini e icone ad accompagnarli – e ultimamente tendiamo ad aggiungere immagini più grandi nei nostri siti. Ma la maggior parte dei contenuti importanti è interamente testuale: titoli, elenchi puntati, paragrafi, citazioni, ecc. Parallelamente, c’è il modo in cui formattiamo il nostro testo per adattarlo al nostro design. Ne cambiamo le dimensioni e i colori, oppure lo rendiamo in grassetto o in corsivo. Questo serve a rendere i nostri contenuti più leggibili, pertinenti e accattivanti per i nostri rispettivi lettori.

    Poiché formattiamo spesso il testo, i pulsanti che ci consentono di cambiare gli stili dovrebbero essere estremamente accessibili. Non dovrebbero essere nascosti all’interno di una finestra popup che dobbiamo prima aprire. La maggior parte dei page builder soffre di questo difetto. Affinché la loro interfaccia utente possa essere etichettata come “ordinata”, persino le opzioni più utilizzate vengono celate alla vista.

    Per risolvere questo problema, abbiamo dato un’occhiata agli elaboratori di testi più comunemente usati. Abbiamo notato che di solito hanno una riga con una miriade di pulsanti vicino alla parte superiore dello schermo utilizzata per formattare il testo e abbiamo replicato lo stesso layout per la versione 3. Ora abbiamo una riga con tutti i pulsanti per la formattazione del testo sempre presente nella parte superiore dello schermo. Questo rende la formattazione davvero rapida e quasi una seconda natura nell’editing del testo.

    Concetto fondamentale n. 4: le opzioni di stile avanzate dovrebbero essere flessibili ma facili da comprendere

    Il punto fondamentale di un page builder è che dovrebbe consentire alle persone di creare design sbalorditivi facilmente. Ciò significa che dovremmo fornire molte impostazioni e opzioni diverse senza imporre una curva di apprendimento complessa. Poter regolare margini, padding e formattare il testo è fantastico, ma queste cose possono fare solo fino a un certo punto. Avrai bisogno di opzioni molto più elaborate per completare il lavoro, opzioni come immagini di sfondo, pattern, bordi, sfondi fissi e altro ancora. Accumulare tutte queste diverse impostazioni può diventare un po’ opprimente, quindi ne abbiamo semplificate alcune e le abbiamo organizzate in categorie per rendere le cose più intuitive nella versione 3.

    Concetto fondamentale n. 5: supporto per gli shortcode

    Infine, non dimentichiamo che il nostro page builder poggia su WordPress. Dovremmo accogliere la piattaforma e le sue funzionalità, senza limitarle o deviare da esse. Una funzionalità fondamentale fornita da WordPress sono gli shortcode. Ciò non significa che l’intero contenuto debba essere composto da shortcode – sarebbe caotico – ma dovremmo piuttosto essere semplicemente compatibili con essi. Molti plugin e temi utilizzano gli shortcode, e sarebbe un vero spreco ignorarli tutti. In effetti, gli shortcode offrono agli utenti la massima flessibilità quando si tratta di creare pagine.

    Alcune settimane fa abbiamo introdotto il nostro sistema di mappatura degli shortcode e, grazie ad esso, abbiamo mappato centinaia di shortcode provenienti da centinaia di plugin. Abbiamo dato la priorità ai plugin più popolari presenti nella directory dei plugin di WordPress, quindi è probabile che tu li incontri nei tuoi siti. Tutto questo si è solo rafforzato nella versione 3, e continueremo a migliorarlo anche in futuro.

    Conclusione

    Abbiamo preso tutte queste proprietà fondamentali menzionate sopra e le abbiamo incorporate in Page Builder Sandwich versione 3. È il miglior page builder che abbiamo creato per WordPress fino ad oggi. È più intuitivo e più naturale da usare, offre prestazioni più veloci, è più facile da utilizzare e più accessibile che mai.

    Se hai qualche opinione su una funzionalità essenziale per un page builder, faccelo sapere lasciando un commento qui sotto.

  • 10 modi in cui il tuo sito può eccellere nella lead generation e come PBS può aiutarti a farlo

    Page Builder Sandwich helps you, well… build websites.

    Keeping your audience reeled into your page (and successfully generating leads) is a different story altogether, though.

    Don’t get us wrong. Lots of sites can achieve this without a worry, but that’s usually because they spend a significant amount of time and research doing just that.

    In contrast, some sites admittedly have a little trouble pulling it off, and more often than not, some of them don’t know where to begin. But don’t worry – Page Builder Sandwich will try to lend you a hand with that very same thing.

    Why is it Important to Generate Leads?

    One crucial thing to remember is that generating leads takes more than just buying a domain and setting a website up.

    Now, before we get too into it, take note that Page Builder Sandwich isn’t a marketing website.

    Ma in ogni caso, è importante sapere che dietro la generazione di lead c’è una scienza e, sebbene noi stessi non siamo esperti di digital marketing, è fondamentale notare che una conversione di successo dei lead dipende anche dalla corretta esecuzione di design e contenuti. È qui che entriamo in gioco noi.

    “Ma come potete aiutarci con l’aspetto del marketing di tutto questo?”

    Great question! A few weeks ago we began corresponding with Straight North, a blog that specializes in digital marketing and lead conversion. They’ve given us some really tips which we hope you guys find helpful in your site-building journey.

    Now, remember that there could be lots of factors as to why your website isn’t generating the amount of leads you’d like. The first step is to identify what these factors are, and hopefully, this list can help you out with doing just that.

    TIP #1: Create Content that Stimulates Action

    According to Straight North, 84% of website conversions occur on the first visit, and only 11% convert in the second.

    In altre parole, la prima impressione è quella che conta.

    Proprio come una brutta audizione non fa ottenere agli attori i ruoli da protagonista, la prima visita di qualcuno sul tuo sito web potrebbe decretare il tuo successo o il tuo fallimento.

    That’s why it’s you and your team’s job to try and convince people to stay glued to your page.

    Straight North suggests that posting copy and content (both text and images) is a great way to catch your visitors’ attention. Remember to always allot sufficient time to research on what makes good copy and good content, and never underestimate either.

    Ecco un paio di siti web che potrebbero aiutarti nel tuo percorso verso la generazione di lead di successo:

    How PBS Can Help:

    Wow your site visitors by using interactive PBS elements like the Carousel, or use Parallax Scrolling, and Video Backgrounds to catch their attention. Remember to execute their placement in a balanced way though, as to not overwhelm your audience.

    TIP #2: Intuitive Navigation

    In the realm of web development and site-building, intuitiveness in the user interface (or UI) is key.

    This means that when your visitors or users find their way around your site by intuition (i.e. easy site-navigation and straightforward instructions), they’re more likely to stay glued on your site.

    Ora, se la navigazione sul tuo sito web si rivela un’esperienza frustrante, è probabile che i tuoi visitatori non restino abbastanza a lungo per ascoltare ciò che hai da dire e ciò che hai da offrire loro.

    Straight North adds that getting too “clever and creative” with navigation labels is a bad idea, and suggest that you use terms like “Contact Us” for call-to-action buttons, rather than using vague labels like “Interact!” or “Dialog.” Remember that bombarding your site with too much jargon can cause frustration to your audience as well.

    So as long as navigating through your website comes to the user as second nature, then you have one less thing to worry about when trying to convert leads.

    How PBS Can Help:

    Page Builder Sandwich’s UI is highly intuitive, and is akin to using a Word processor (like Google Docs and Microsoft Word). Check out our demo to get some inspiration on how you can apply intuitive changes to your site, too!

    OTHER PAGE BUILDERS …have too much stuff going on.

    PAGE BUILDER SANDWICH …gets straight to the point.

    TIP #3: Use Relevant, Custom Imagery

    Your images and how they’re presented also matter, and they matter a lot.

    While it may seem trivial to some, uploading boring stock images, stretched out/pixelzed photos, or badly-presented typography is a huge factor that dictates whether your visitors stay on your site, or move to a better, more credible-looking alternative.

    How PBS Can Help:

    Because it’s WordPress-run, PBS lets you post high-quality photos in your website. As long as you have the right image dimensions, you shouldn’t have a problem with posting photos.

    Additional lifehack: You can also check out Pexels.com and Unsplash.com to get awesome, high-quality stock photos!

    TIP #4: Persuasive Credibility Elements

    Skepticism is a huge conversion killer.

    That’s why more often than not, it’s always a good idea to add in elements that back up your credibility as a website (or business), like testimonials from credible sources, and logos of reputable companies or groups that you’ve worked with. So use customer testimonials, show logos of well-known customers, and include third-party mentions in your content.

    How PBS Can Help:

    Use PBS features to vouch for you. Display your customers’ testimonials in a Carousel, or use the Featurette element to showcase third-party mentions, or make use of the column element to effectively display logos of your well-known customers (like in the graphic above).

    TIP #5: Get Personal!

    Straight North says that using a lighter, casual tone makes all the difference when writing content (such as articles and bio’s) on your site. This lets your users know that you’re human too, and not just some bot trying to get a run for their money (which we hope you aren’t).

    How PBS Can Help:

    While this part is entirely up to you and your team, it wouldn’t hurt to use elements such as the Featurette, Gallery, and Image Box to liven up your bio’s as well. Adding in other PBS elements like Social Media Icons can help put a personal touch to your pages, too.

    PBS’ Industry Template makes full use of the Image Box Elements for its About Us and Feature Sections.

    TIP #6: Irresistible Calls-to-Action

    Calls-to-Action (CTA) are a crucial part of generating leads.

    You will FAIL to capture first-visit conversions unless you ASK. – Straight North

    Just asking isn’t enough, though. According to Straight North, your calls-to-action should be executed both “skillfully and persuasively”.

    The trick is to have effective Calls-to-Actions plus a good combination of smart consistent placement, offers that give off substance, time-sensitive offers (giving them offers for a set, limited time will give them a sense of urgency), and most importantly, guaranteed offers.

    You want your site to trust you. “Take away all arguments for delay, and conversions will increase”, Straight North says.

    How PBS Can Help:

    PBS’ Call-to-Action Button – as well as other elements such as the Countdown and Page Heading element – can help ease your burden regarding this task.

    Executing them correctly is up to you and your team though, so make sure to give time to research about CTA placements and other marketing tips.

    Ecco alcune risorse che possono aiutarti a migliorare l’efficacia delle tue CTA:

    TIP #7: User-Friendly Forms

    Una persona che ti invia le proprie informazioni tramite un modulo sul tuo sito web è in definitiva ciò che misura il successo di una conversione di lead.

    This is why placing user-friendly contact forms on your site is of the utmost importance. They’re the ultimate “make-or-break stage of a great conversion opportunity”, says Straight North.

    A couple of PBS’ third-party plugins available for shortcode mapping

    So don’t intimidate your site visitors by overwhelming them with too many question forms, or have them exhaust too much energy, like having them type long sentences instead of choosing their answers from a drop-down list.

    Letting them know that you value their privacy is also a must. Be sure to place clean, good-looking forms on your site so as to boost credibility.

    How PBS Can Help:

    With PBS’ Shortcode Mapper feature, you can place awesome, reputable contact forms like Advanced Custom Fields (ACF) and Contact Form 7 on your site.

    TIP #8: Prominently Displayed Phone Numbers (or Contact Details)

    Contact number and social media buttons displayed prominently in PBS’ Restaurant Template

    Una visualizzazione coerente e ben visibile dei numeri di telefono è d’obbligo se sei un tipo di attività che offre supporto telefonico. Straight North aggiunge che investire in numeri verdi può anche darti una bella spinta alle conversioni.

    Se sei un’azienda tecnologica come noi, è anche una buona idea mostrare il tuo indirizzo e-mail (o altri modi con cui i visitatori possono contattarti) sul tuo sito web.

    How PBS Can Help:

    PBS’ Full Page Niche-Based Templates have fields that let you feature phone numbers and other contact information more prominently, so that your visitors can reach you right away.

    TIP #9: Continuous Testing

    Straight North attests to the importance of site maintenance and testing: “No matter how good your website is in converting leads, it can always be better.”

    Questo vale per qualsiasi sito web, non solo per uno che cerca di convertire lead. Assicurarsi che il proprio sito sia in perfetta forma e che i clienti siano sempre soddisfatti aiuterà la tua attività a fare molta strada.

    How PBS Can Help:

    This one is up to you, but if you’d like a tip: the PBS Team continuously tests the site and page builder for any bugs, and always work to make sure you guys are satisfied. We don’t exactly have a feature for making sure you do regular tests on your site, so this one’s entirely up to you and your team. Do it, and do it well!

    TIP #10: Mobile-Friendly Design

    Almost everyone has a cellphone or tablet; but while only 23 percent of lead conversion rates come from mobile devices, it absolutely will not do to ignore any sort of potential conversions, no matter the percentage (leads are still leads, after all).

    “Users converting from desktop view may have seen the site initially on a mobile device,” Straight North says. “Mobile conversions are (also) likely to grow as mobile Internet access continues to soar at the expense of desktops.”

    You can preview your site on mobile view directly on desktop

    How PBS Can Help:

    Page Builder Sandwich is Mobile Responsive. You can view PBS-built sites on mobile, as well as check previews of your mobile site directly through desktop while editing. This way, you won’t have to keep switching to your phone in order to check if your site looks good on mobile.

    Everything Matters in Site-Building

    At the root of it all, it’s very, very important to understand that everything on your website – down to the smallest of details – has an impact on your audience.

    The quality of your copy, images, your layout – all of it matters, and it matters a lot.

    E uno dei più grandi errori che le persone commettono quando cercano di generare lead è proprio questo: dare per scontati piccoli aspetti che compongono il sito web (come design, testi e altri contenuti).

    Hopefully your website garners the success it very well deserves; it’s been built with PBS, after all. ?

    Buona fortuna per tutti i tuoi progetti e grazie, come sempre, per aver utilizzato Page Builder Sandwich!

    Buona creazione di siti!

  • Buon 4 luglio! 20% di sconto su TUTTE le licenze fino al 6 luglio!

    Ottieni il 20% DI SCONTO su tutte le licenze Page Builder Sandwich dal 4 al 6 luglio 2017! Basta inserire il codice promozionale 4JULY2017 per ottenere il tuo sconto oggi stesso!

  • AGGIORNAMENTO PBS: Versione 4.1 e usabilità

    Dopo il rilascio della versione 4.0 lo scorso gennaio, abbiamo continuato a lavorare sullo sviluppo di PBS, aggiungendo sia correzioni che miglioramenti. Siamo entusiasti di condividerli con voi, quindi ecco cosa abbiamo in serbo per l’aggiornamento alla versione 4.1.

    Miglioramenti alla barra di formattazione

    L’ultimo aggiornamento 4.1 ruota attorno alla barra di formattazione del testo. Oltre a risolvere numerosi bug, abbiamo anche migliorato alcuni elementi della barra che dovrebbero rendere la vostra esperienza con PBS più fluida ed efficiente.

    Aggiornamenti al selettore colore

    Nelle versioni precedenti di PBS, il selettore colore presentava alcuni problemi che creavano qualche inconveniente nel processo di modifica, in particolare per quanto riguarda la modifica del testo e del suo colore. Per la versione 4.1, tuttavia, abbiamo risolto il problema e apportato nuove modifiche per una modifica del testo senza problemi.

    • Più campioni di colore per una selezione più semplice
    • Il selettore colore ora mostra la trasparenza
    • Correzioni di bug per quanto riguarda la modifica del colore del testo

    Aggiornamenti alla formattazione del testo

    In precedenza, c’erano alcuni pulsanti su cui bisognava cliccare ripetutamente per aumentare un valore, e poi tenere premuto CTRL/CMD e cliccare per diminuirlo. Inizialmente pensavamo che fosse intuitivo, ma gli utenti ci hanno fatto notare che non era così ovvio. Abbiamo risolto queste incongruenze in questo aggiornamento.

    • L’altezza della linea (interlinea) è ora più facile da gestire: trascina il cursore per regolarla alla dimensione desiderata, o inserisci semplicemente il valore desiderato nello spazio apposito
    • Il pulsante della dimensione del font è stato diviso in due pulsanti: diminuisci e aumenta per un utilizzo più semplice
    • Anche l’aumento/diminuzione della dimensione del font è più accessibile, ora con i px come unità di misura per una modifica più semplice. In precedenza, mostrava un’unità “x” che non significava davvero nulla
    • I pulsanti di allineamento a sinistra/centro/destra/giustificato sono ora raggruppati insieme per ridurre il numero di pulsanti visualizzati
    • Il pulsante “Cancella formattazione” ora rimuove anche gli altri stili (come line-height), cosa che prima non faceva

    Miglioramenti alla linea orizzontale

    In precedenza, la linea orizzontale (horizontal rule) causava alcuni problemi. Con alcuni temi, le linee orizzontali erano così sottili da risultare difficili da cliccare. Per risolvere questo problema, abbiamo rimosso la linea orizzontale dalla barra di formattazione e l’abbiamo trasformata in un elemento a sé stante. Inoltre, ora puoi anche modificare i colori della linea tramite il selettore colore.

    Aggiornamenti futuri: cosa c’è in serbo per PBS?

    Come abbiamo detto, abbiamo ancora nuove funzionalità (e altri aggiornamenti) in cantiere. Ecco una piccola anteprima di ciò che abbiamo in serbo per voi per il futuro:

    • Google Fonts (finalmente!)
    • Stiamo valutando l’idea di rendere la barra di formattazione del testo qualcosa di più di un semplice spazio per formattare solo il testo. E se i pulsanti cambiassero a seconda del contesto attuale? Ad esempio, sarebbe fantastico se comparisse un pulsante di allineamento verticale quando si modifica del testo all’interno di una colonna.

    Cosa vorresti vedere nei futuri aggiornamenti di PBS?

    Siamo sempre pronti a migliorare PBS, quindi se avete suggerimenti, fatevi sentire! Avete richieste di funzionalità che vorreste aggiungere alla nostra lista in continua crescita? Qualsiasi altra cosa che ritenete possa richiedere qualche modifica nella versione attuale? Fatecelo sapere nei commenti qui sotto!

    Buona creazione di siti!

  • Festeggiamo il primo compleanno di Page Builder Sandwich col botto!

    pbs-v4-ad-3 Sì, proprio così: Page Builder Sandwich festeggia il suo primissimo compleanno il 14 gennaio 2017. Oltre ai nostri attuali Saldi delle Feste (30% di sconto per un periodo limitato, nessun codice promozionale necessario), PBS ha un paio di sorprese in serbo per voi, e il team non vede l’ora di condividerle con tutti.

    Nell’ultimo anno siamo cresciuti molto grazie al supporto di amici fantastici, ad alcune recensioni molto utili e ai nostri nuovi amici della community Slack di PBS. Non potevamo certo dimenticarci di voi: gli utenti stessi di PBS, che ci hanno aiutato a raggiungere questo traguardo. E quindi, per festeggiare, abbiamo pensato: quale modo migliore per offrirvi un’esperienza ancora migliore se non il rilascio di PBS Versione 4.0? Via ai coriandoli.

    Nel caso ve lo foste perso, la versione attuale, la Versione 3.0, è stata sottoposta ad alcuni importanti cambiamenti e miglioramenti. Tra questi, un’interfaccia più pulita, fluida e intuitiva, oltre a una migliore responsività. Per la Versione 4.0, tuttavia, aggiungeremo novità ancora più straordinarie! Quindi preparatevi, perché le cose saranno molto più divertenti, festive e funzionali con l’imminente rilascio di gennaio.

    Funzionalità Template a Pagina Intera

    La prima novità nella nostra lista delle funzionalità principali sono i nuovissimi Template a Pagina Intera. Sebbene PBS sia comunemente utilizzato per creare ogni tipo di pagina, abbiamo preso in seria considerazione il fatto che i nostri utenti operino in nicchie differenti (e quindi con diversi tipi di siti web). Dopotutto, utenti diversi hanno esigenze diverse, che si tratti di attività aziendali o progetti personali. Ecco perché abbiamo deciso di rispondere a questo con l’imminente funzionalità dei Template a Pagina Intera.

    pbs-v4-ag-2 Come funzionano quindi questi Template a Pagina Intera? Semplice. Con la Versione 4.0 rilasceremo una serie di fantastici template. Saranno suddivisi in diverse categorie, ciascuna progettata per una nicchia specifica. I template includeranno elementi, layout e funzionalità per pagine aziendali, portfolio, siti di eCommerce o semplicemente i consueti blog personali (tra gli altri), in modo da adattarsi perfettamente a qualsiasi sito di cui abbiate bisogno.

    Così, ad esempio, se gestite un ristorante e avete bisogno di una pagina o di un sito web su misura per questo tipo di attività, potete semplicemente scegliere il template per ristoranti. E poiché PBS consente una personalizzazione flessibile, potrete comunque personalizzarne lo stile a vostro piacimento. Inoltre, dato che il template scelto (in questo caso, quello per ristoranti) includerà funzionalità specifiche pensate appositamente per un sito aziendale a tema ristorazione, sarà dotato anche di elementi PBS che rispondono alle esigenze di quel tipo di sito: come un’intera sezione per il menu, una funzione per le consegne a domicilio, pulsanti per i social media e molto altro. Ora immaginate qualcosa di simile per la vostra nicchia specifica: che gestiate uno studio aziendale, un’attività personale o anche solo un portfolio, non preoccupatevi. Con la Versione 4.0 rilasceremo template anche per questi. Saranno senz’altro utilissimi per la vostra prossima avventura di creazione di siti web!

    Più Elementi, Più Opzioni

    Oltre ai nuovi Template a Pagina Intera, abbiamo in arrivo anche molte altre novità! Come diciamo sempre, PBS esiste perché crediamo che creare cose straordinarie e sbalorditive non debba essere così difficile come tutti dicono. Con questo spirito, vi invitiamo a dare un’occhiata alle nostre altre funzionalità in arrivo, così potrete vedere voi stessi tutte le pagine e i siti splendidi e fantastici che potrete creare con PBS!

    Sfondi Parallasse

    Lo scorrimento parallasse è una tecnica utilizzata per creare un effetto di sfondo 3D unico per il vostro browser. È un elemento d’impatto straordinario per qualsiasi sito web e, se realizzato nel modo giusto, può sicuramente aumentare il vostro pubblico. Non siete ancora convinti? Date un’occhiata a questo fantastico sito web di FireWatch che realizza l’effetto parallasse alla perfezione.

    Sfondi Video

    Anche gli sfondi video sono un effetto molto popolare utilizzato sui siti web, in particolare su home page, landing page e intestazioni hero. Sono altrettanto sbalorditivi, e c’è un motivo se vanno così di moda, fidatevi! E con l’ultimo aggiornamento di PBS, avrete la possibilità di provare anche gli sfondi video. Non esitate a usarli per catturare l’attenzione del vostro pubblico e ottenere più visite al sito!

    Conto alla Rovescia con Data

    Per la Versione 4.0 rilasceremo anche il nuovissimo Conto alla Rovescia con Data. Includerà le funzioni di base come l’impostazione della data e dell’ora esatte verso cui effettuare il conto alla rovescia, oltre alle immancabili opzioni di personalizzazione flessibile che siamo certi adorerete.

    Icone Social

    Volete incoraggiare il vostro pubblico a condividere i vostri articoli sui social media? Niente paura, PBS pensa a tutto! Con le nuove icone social, i lettori potranno condividere il vostro sito web e i vostri contenuti con un semplice clic.

    Ma abbiamo ancora molto altro in serbo per voi! Tra cui:

    • Possibilità di aggiungere articoli ai vostri contenuti
    • Barre di avanzamento
    • Contatori numerici progressivi
    • Elementi per WooCommerce, Advanced Custom Fields (ACF), Contact Form 7
    • Testimonianze
    • Tabelle dei prezzi
    • Chiamate all’azione
    • Box immagine
    • Box icone
    • Ricerca e download gratuiti di immagini
    • Possibilità di aggiungere CSS personalizzato
    • …e molto altro!

    Responsività

    E infine, oltre a tutte queste fantastiche nuove funzionalità, PBS vanterà anche una responsività ancora migliore.

    pbs-v4-ag-1 In passato, visualizzare e modificare la propria pagina PBS su dispositivi mobili non si è rivelato esattamente una passeggiata: le dimensioni dei font non corrispondevano, le immagini non erano proporzionate; nel complesso, sapevamo di dover lavorare sull’interfaccia utente di PBS per dispositivi mobili, ed è esattamente ciò che abbiamo fatto. Abbiamo lavorato su questa specifica funzionalità e l’abbiamo perfezionata in modo che non solo sia esteticamente migliore in termini di interfaccia utente, ma risulti anche più fluida e accessibile. Ora potrete visualizzare e modificare il vostro sito su mobile senza alcuna difficoltà. I vostri occhi vi ringrazieranno sicuramente, e lo farà senz’altro anche il vostro pubblico.

    Più Fluido, Migliore, Ancora Più Straordinario.

    Per concludere, siamo sinceramente grati per tutto il vostro supporto e la vostra fedeltà a PBS, e speriamo che siate entusiasti quanto noi, perché ci aspetta un’avventura fantastica!

    Quindi, questi prossimi aggiornamenti soddisfano le vostre aspettative? C’è qualcos’altro che vorreste suggerire per la v4? Lasciateci un commento qui sotto e vedremo cosa possiamo fare!

    Per rimanere sintonizzati su ulteriori aggiornamenti sulla v4 (e su altre cose fantastiche), iscrivetevi alla nostra newsletter qui sotto facendo clic sul pulsante “Iscriviti”! Non preoccupatevi: potete annullare l’iscrizione in qualsiasi momento.

    Sperando che abbiate trascorso delle buone feste,

    Il Team di PBS

    Buona creazione di siti!

  • Aggiungi facilmente moduli di iscrizione alla newsletter via email

    Easily-Add-Email-Newsletter-Signup-FormsAdding an email newsletter sign up form to your site is a great way to grow your website’s following and to keep your website visitors interested in your site or product. And now you can easily add and customize newsletter sign up forms directly in your designs.

    preview-newsletterNew in Page Builder Sandwich is the Newsletter Element (check the short gif above). Now you can add a newsletter sign up form for your MailChimp, AWeber or MailPoet newsletter lists directly into your designs.

    Normalmente dovresti installare un altro plugin, poi magari aggiungere uno shortcode da qualche parte, oppure passare attraverso un popup e compilare alcuni campi, o forse configurare un widget per far funzionare il tuo modulo di iscrizione alla newsletter. Ora tutte le complessità legate all’aggiunta dei moduli di iscrizione alla newsletter sono sparite. Ti basta aggiungere l’Elemento Newsletter sulla tua pagina, inserire le chiavi API della tua lista e dovrebbe funzionare immediatamente.

    Puoi personalizzare ulteriormente il tuo modulo di iscrizione semplicemente facendo clic sul campo dell’email – dove puoi cambiarne i colori, le dimensioni, il bordo e molto altro – oppure sul pulsante – per poi aggiungere icone, cambiare le dimensioni del pulsante o persino fare in modo che compaia solo quando il visitatore inizia a digitare il proprio indirizzo email. Puoi personalizzare completamente l’aspetto per adattarlo al tuo design. Vuoi che il campo cambi colore quando l’utente sta digitando? Puoi farlo facilmente con un selettore di colori. Hai bisogno di un design minimalista in cui il campo è solo un bordo? Nessun problema!

    Una cosa fantastica è che l’elemento newsletter non interrompe la navigazione dell’utente all’interno del tuo sito. Una volta effettuata l’iscrizione, la pagina non si ricaricherà e il modulo di iscrizione verrà semplicemente sostituito da un messaggio di “ringraziamento”. Anche questo messaggio e i suoi colori sono personalizzabili.

    Come per il resto di Page Builder Sandwich, puoi posizionare il tuo nuovissimo modulo di iscrizione alla newsletter ovunque desideri: basta trascinarlo all’interno delle tue righe o in un’altra posizione.

    Le mailing list sono importanti?

    La risposta breve è sì. Sai bene che se hai un account Twitter, gli altri utenti di Twitter possono letteralmente “seguirti” e vedranno i tuoi Tweet; una mailing list è il modo in cui i tuoi visitatori possono seguire il tuo sito tramite email.

    Non hai ancora una mailing list?

    If you don’t have a mailing list yet, now is a good time to get started. Getting a newsletter service like MailChimp or AWeber is good since they do the heavy lifting of managing your subscribers and blasting an email to your subscribers easily. They also have newsletter builders that will let you create a newsletter campaign easily. The good thing is they have free plans, so you won’t need to shell out cash in order to try it out.

    If you’re more of a I-like-to-handle-it-myself guy or gal, then you might consider using MailPoet. It’s downloadable free from wordpress.org and they have a paid model as well. With MailPoet, you’ll be able to see your subscribers within your dashboard and you can also send out emails from there. It’s easy to use as well and just takes literally less than 5 minutes to fully set up in your site (Yes, I’ve tried).

    Scopri di più su Page Builder Sandwich

  • Dove le cose si fanno un po’ tecniche: come abbiamo realizzato la nostra versione dello Shortcode Mapping

    How-We-Made-Our-Version-Of-Shortcode-Mapping-Happen-2Nell’articolo precedente, abbiamo discusso le basi della mappatura degli shortcode e di come accedere ai suoi fantastici vantaggi. Abbiamo deciso di dividere l’articolo dedicato alla versione di Page Builder Sandwich della mappatura degli shortcode, poiché la trattazione seguente potrebbe diventare un po’ più tecnica.

    Di seguito sono riportate descrizioni più approfondite del funzionamento interno della nostra funzionalità di mappatura degli shortcode e di come l’abbiamo fatta funzionare.

    Un processo automatizzato

    Per decidere quali plugin includere nel mappatore di shortcode, abbiamo creato uno script automatizzato che raccoglie i migliori plugin nella directory dei plugin di WordPress in base ai seguenti criteri:

    • Tra i 1.000 plugin popolari, più votati e aggiornati, con almeno 4.000 installazioni attive,
    • Con almeno 4.000 installazioni attive,
    • Con almeno 20 valutazioni, e;
    • Con una valutazione media di almeno 3 stelle

    Eseguiamo questa query ogni giorno sulla directory dei plugin di WordPress. Questi filtri assicurano di ottenere un elenco di plugin di buona qualità utilizzati da molte persone. Al momento della stesura di questo articolo, questi criteri hanno prodotto 800 plugin. Sono tantissimi. Davvero tanti.

    Alcuni dei plugin più popolari rilevati per la mappatura degli shortcode.
    Alcuni dei plugin più popolari rilevati per la mappatura degli shortcode.

    Eseguiamo poi una serie di controlli automatizzati sul codice sorgente di ciascun plugin per scoprire se contiene shortcode, e quindi cerchiamo di individuare tutti quegli shortcode, inclusi tutti i loro attributi. Elaborando i dati, il risultato è stato di oltre 2.000 shortcode. Doppio wow. Gli shortcode rilevati vengono quindi inseriti nel database di mappatura degli shortcode per un’ispezione manuale.

    Alla fine di questo processo, otteniamo un enorme elenco di plugin e dei loro possibili shortcode. Ora si tratta solo di ripulire questi dati per assicurarsi che tutto sia corretto.

    Un processo manuale

    Questa è probabilmente la parte più difficile dell’intero sistema di mappatura. Il codice dei plugin si presenta in forme e dimensioni diverse, e non tutti gli shortcode vengono rilevati automaticamente dai nostri script. Anche se il Codex di WordPress suggerisce di usare la funzione `shortcode_atts` per filtrare gli attributi di uno shortcode, questa è solo una raccomandazione e non tutti lo fanno. Inoltre, non esiste un modo infallibile per controllare la struttura interna di uno shortcode quando un plugin è installato.

    Per assicurarci quindi di individuare correttamente tutti gli shortcode e i loro attributi, abbiamo creato un’area front-end dedicata alla modifica di shortcode e attributi, realizzata con AngularJS e Bootstrap.

    Interfaccia Bootstrap & AngularJS per sistemare tutti gli shortcode mappati.
    Interfaccia Bootstrap & AngularJS per sistemare tutti gli shortcode mappati.

    Dovremo esaminare manualmente ogni singolo plugin, controllarne la documentazione degli shortcode e assicurarci che tutti i dati in nostro possesso siano corretti.

    Anche se questo processo è estremamente noioso, ci sono alcuni lati positivi nell’avere un processo automatizzato:

    • Secondo le nostre prime statistiche, solo circa 1 plugin su 2 ha shortcode.
    • La metà degli shortcode rilevati non ha attributi (ma una parte di questi potrebbero essere falsi positivi)
    • Selezionando solo plugin di buona qualità, molto probabilmente questi dispongono di una documentazione per gli shortcode

    Solo quando tutti gli shortcode di un plugin saranno stati controllati, il server inizierà a distribuire le mappature degli shortcode di quel plugin agli utenti.

    Una chiamata REST API

    L’ultimo tassello del puzzle è il plugin stesso. Il concetto qui è semplice: scoprire quali plugin sono attivi, quale tema sta utilizzando il sito e quali shortcode sono disponibili, quindi chiedere al database di mappatura degli shortcode se contiene le relative mappature. Per questo abbiamo creato un endpoint WP REST API personalizzato che tutti i client contattano per ottenere le mappature degli shortcode più recenti.

    Il futuro: Crowdsourcing

    Controllare manualmente ciascun plugin richiede molto tempo e impegno. Una volta che la piattaforma di mappatura degli shortcode sarà stabile, prevediamo di aprirla a tutti. Ciò significa che chiunque potrà contribuire ad aggiungere shortcode.

    Potreste pensare: “Perché dovrei aiutare a mappare gli shortcode? Cosa ci guadagno?” Beh, vengono in mente alcune ragioni per cui le persone vorrebbero dare una mano:

    1. Se hai creato un plugin e non l’abbiamo ancora intercettato a causa dei criteri sopra indicati (ed è nella directory dei plugin di WordPress), puoi aggiungere tu stesso le mappature. Il tuo plugin diventerà completamente supportato da PBS!
    2. Dato che nel processo automatizzato gestiremo solo quelli presenti nella directory dei plugin di WordPress, gli autori di plugin e temi premium non saranno inclusi. Quindi, se ne hai uno, puoi aggiungere tu stesso le mappature degli shortcode anche per quelli.
    3. E per chi non crea plugin, possiamo ricompensare chi ci aiuta. Per rendere la mappatura degli shortcode un’iniziativa allettante, possiamo premiare i volenterosi aiutanti con una licenza personale o un passaggio a una licenza premium di PBS!

    Iscriviti alla nostra newsletter

    La funzionalità di mappatura degli shortcode sarà disponibile per i nostri clienti indicativamente il 12 agosto  15 agosto  16 agosto 2016. Non tutti gli shortcode saranno mappati entro tale data (la nostra stima è di circa 100 plugin), ma la mappatura proseguirà costantemente e i clienti la riceveranno non appena ne verranno rilasciati di nuovi.

    Iscriviti alla nostra newsletter per ricevere notizie sulla mappatura degli shortcode, sulla data di rilascio e su quando apriremo la mappatura degli shortcode al pubblico!