Page Builder Sandwich

Obtenha o PBS Pro

Autor: Neil Lock

  • Como Funciona o Page Builder Sandwich

    Como o Page Builder Sandwich funcionaEste artigo trará uma visão geral rápida de como o Page Builder Sandwich funciona e serve como uma introdução para quem tem interesse em saber como nosso construtor de páginas se integra a diferentes recursos do WordPress. Não vou me aprofundar nos recursos individuais do Page Builder Sandwich; se quiser conhecê-los, acesse nossa página de vídeos, onde apresentamos cada recurso individualmente por meio de breves gravações de tela.

    Se você quiser saber como o Page Builder Sandwich se diferencia de outros construtores de páginas disponíveis, confira nosso artigo Como o Page Builder Sandwich é diferente dos demais.

    Onde está o construtor de páginas?

    Onde ele fica? E o que posso editar com ele?

    Ao contrário de muitos outros construtores de páginas, o Page Builder Sandwich funciona diretamente no front-end do seu site. Se você estiver no back-end, disponibilizamos um botão “Frontend” junto aos botões do editor de conteúdo que levará você diretamente ao front-end da sua página.

    O Page Builder Sandwich permite que você edite seus posts, páginas e conteúdos de tipos de post personalizados (custom post types). No entanto, ele não permite editar diretamente a listagem de posts do blog na página inicial nem outras áreas não individuais do site. Pense da seguinte forma: se o que você deseja editar possui um editor de conteúdo no back-end (como “Novo post” e “Nova página”), o Page Builder Sandwich pode ser utilizado. Você pode editar suas páginas e posts de blog individuais e, se por exemplo tiver um plugin que adiciona cardápios de restaurantes ou itens de portfólio, também poderá editá-los.

    No front-end, adicionamos um botão azul “Edit with Page Builder Sandwich” na sua barra de administração. Basta clicar nele para começar a editar sua página.

    Edição direta de conteúdo

    Com o Page Builder Sandwich, tornamos a edição de conteúdo o mais fácil e descomplicada possível. Editar conteúdo é simples e direto: basta clicar e digitar. Simples assim.

    O inspetor

    Apresentando o inspetor

    Notamos que muitos construtores de páginas utilizam pop-ups em excesso. Pessoalmente, não gosto de pop-ups porque eles distraem e basicamente dizem: “ei, pare o que está fazendo até preencher esses campos primeiro”. Eles quebram o fluxo do que deveria ser uma experiência de edição fluida. Por isso, minimizamos o uso de pop-ups ao máximo e, em vez disso, criamos o inspetor.

    O inspetor é uma barra lateral que reúne todas as ferramentas de formatação e layout de que você vai precisar. Ele pode ser fixado no lado esquerdo ou direito da tela para que você veja com facilidade o que está editando.

    No inspetor, você pode ajustar várias propriedades de texto, como títulos, tamanhos de fonte, negrito, itálico, cores de texto e muito mais. Além disso, ele permite adicionar imagens e criar linhas ou conteúdo em colunas. Também oferece edições mais avançadas, como ajustar linhas para largura total da página, alterar cores de fundo de linhas e colunas, definir alinhamento vertical de conteúdo, além de margens e planos de fundo. É uma ferramenta muito poderosa que você utilizará na maior parte do tempo.

    Integração com temas do WordPress

    Por padrão, o Page Builder Sandwich quase não inclui estilos próprios. Ao editar o conteúdo, os estilos que você vê são baseados principalmente no seu tema.

    Integração com shortcodes

    Os shortcodes são um elemento fundamental no WordPress e, muito provavelmente, você usará vários deles no seu site. O Page Builder Sandwich lida muito bem com eles, exibindo os shortcodes devidamente renderizados no front-end. Eles continuam editáveis e o melhor é que, depois de fazer suas alterações, eles são renderizados novamente de forma instantânea.

    Para maior comodidade, você pode editar seus shortcodes diretamente pelo inspetor. Caso queira mais controle, basta dar um duplo clique nos shortcodes para editá-los em formato bruto. Além disso, todos os shortcodes disponíveis no seu site são listados no inspetor para facilitar a inserção no seu conteúdo.

    Sem inchaço

    E quanto ao inchaço no site?

    Quem gosta de sites lentos? Nós não, e você com certeza também não. Garantimos que o Page Builder Sandwich tenha um impacto praticamente nulo no desempenho do seu site. Para usuários desconectados, são carregados apenas os estilos CSS essenciais de linhas e colunas, além dos scripts JS e CSS estritamente necessários para os shortcodes utilizados.

    Para desenvolvedores

    Se você é um desenvolvedor e utiliza shortcodes nos seus plugins do WordPress, o Page Builder Sandwich disponibiliza uma Shortcode API para que você ofereça facilmente campos intuitivos de criação e edição dos seus shortcodes aos seus clientes.

    Se quiser estender ainda mais os recursos ou integrá-lo a outras partes do Page Builder Sandwich, também disponibilizamos diversos action e filter hooks muito úteis para você utilizar.

  • Promoção Exclusiva da Cloudways para Usuários do PBS!

    Estamos colaborando com a Cloudways, uma das plataformas de hospedagem em nuvem gerenciada mais incríveis da web. Se você ainda não ouviu falar deles, eles são bastante confiáveis na comunidade WordPress, provando ser um dos serviços de hospedagem mais confiáveis do mercado. Eles também contam com recursos incríveis, como Múltiplas Infraestruturas de Nuvem, Múltiplos Datacenters e Hospedagem SSD, além de clonagem com 1 clique, backup e restauração com 1 clique e mapeamento de domínio com 1 clique.

    A boa notícia é que nos unimos à Cloudways para criar uma promoção exclusiva para os fãs do Page Builder Sandwich que desejam experimentar a Cloudways ou como um agrado para os usuários atuais da Cloudways! Basta inserir o código Basta inserir o código:

    CWPBS15

    ..para ganhar $15 de desconto ao fazer o upgrade da sua conta Cloudways. Esta oferta também oferece a você um servidor DigitalOcean de 1 GB na Cloudways por 1 mês. Esta é uma ótima oferta para quem deseja mudar de provedor de hospedagem ou para quem quer criar novos sites ou aplicativos web.

    Esperamos que você aproveite esta promoção tanto quanto nós gostamos de trabalhar com a Cloudways!

  • O que é um Page Builder e por que o Front-End é importante

    O que é um Page Builder e por que o front-end importaSe você é um blogueiro assíduo e toda a criação de conteúdo que realiza gira em torno de escrever artigos completos que contêm uma imagem complementar ocasional, talvez o editor de conteúdo TinyMCE existente seja suficiente para as suas necessidades. O conjunto de ferramentas atual já contém os recursos necessários para escrever artigos; você tem as ferramentas básicas de formatação de texto, como negrito, itálico, títulos, etc. Mas isso é praticamente tudo.

    Sem recursos amigáveis de layout

    Embora você possa escrever artigos com o editor de conteúdo TinyMCE atual, não há uma maneira decente de diagramar seu conteúdo além de ter uma única coluna contínua de texto. Por padrão, você não consegue dividir seu texto em duas ou mais colunas, nem criar conteúdo dividido em seções com uma cor de fundo diferente. Se você quiser que outras seções do seu site, como páginas de destino e páginas de contato, sejam exclusivas, precisará de algum tipo de recurso básico de layout.

    Outros tentaram contornar esse problema utilizando o recurso de shortcodes do WordPress. Em resumo, os shortcodes permitem que trechos de código sejam inseridos por meio de tags especiais. Existem plugins do WordPress que introduzem diferentes shortcodes que você pode usar para criar conteúdo em colunas. Por exemplo, você poderia envolver seu conteúdo com várias tags de coluna se quisesse colocá-lo em um layout de duas colunas. Embora esse método “funcione”, ele não é visualmente amigável, pois eventualmente, à medida que você adiciona mais conteúdo, tudo parecerá uma grande bagunça.

    Para preencher essa lacuna de layout, os page builders foram criados.

    Blocos de construção de páginas

    Os page builders facilitam a criação de conteúdo com layout

    Os page builders oferecem ferramentas adicionais que facilitam a organização do seu conteúdo em layouts exclusivos. Os page builders geralmente removem o editor de conteúdo TinyMCE do back-end e o substituem (ou adicionam) por um novo que ajuda você a visualizar seu conteúdo. Se você nunca usou um page builder de back-end antes, imagine um conjunto de blocos em que cada bloco representa um tipo de conteúdo: uma imagem, texto ou um shortcode. Ele permite, então, arrastar e soltar esses blocos em diferentes layouts e colunas.

    Além da diagramação, os page builders também facilitam a criação e o posicionamento de shortcodes. Antes, você podia ver os shortcodes em toda a sua glória bruta. Você via os colchetes com todos os atributos e valores misturados ao seu conteúdo. Os page builders geralmente incluem criadores de shortcodes – caixas de diálogo pop-up que tornam a escolha de atributos de shortcodes muito mais prática do que simplesmente digitá-los.

    Page builders de front-end são o futuro

    Embora tudo isso proporcione uma experiência melhor para designers e criadores de conteúdo, os page builders de back-end têm um grande problema inerente a eles. Embora seja possível ver uma representação visual de como seria o seu conteúdo, o que você está vendo não é o seu conteúdo real. Isso faz com que as pessoas verifiquem constantemente a pré-visualização de suas páginas para ver se o que estão fazendo está correto. Ao usar page builders de back-end, eu pessoalmente clico no botão de pré-visualização pelo menos 20 vezes com facilidade apenas para verificar se o meu conteúdo está alinhado corretamente ou se minhas margens estão espaçadas uniformemente. Esse é um incômodo enorme que consome muito tempo.

    Para resolver esse inconveniente, os page builders deveriam ser levados para o front-end. Se isso for feito, eliminará o processo de adivinhação da diagramação de páginas, já que você poderá ver os resultados imediatamente.

    No momento, existem muitos page builders de back-end e apenas alguns de front-end. Entre esses poucos está o Page Builder Sandwich. Se você quiser saber mais sobre o que torna o Page Builder Sandwich único e por que ele é a ferramenta certa para você, leia o artigo Como o Page Builder Sandwich é diferente dos demais.

  • Page Builder Sandwich 2017: Retrospectiva do Ano

    Em 2017, começamos a expandir os recursos do Page Builder Sandwich. Este ano foi um grande salto para nós, e não poderíamos estar mais felizes.

    Recebemos muitos comentários e apoio de nossos usuários, bem como de nossos amigos do WordPress. E por causa disso, conseguimos criar algo grande, algo que permitiu a você criar coisas maravilhosas conosco.

    So without further ado, let’s look back at Page Builder Sandwich’s 2017. Here are our favorite updates and releases from this year.

    Parallax Scrolling

    Parallax Scrolling is a background effect that gives your page a a 3D layered look while you scroll.  We made adding this effect easy for our users- simply select the Parallax Scrolling option in your row’s background to add the parallax effect.

    Video Backgrounds

    Assim como na Rolagem Parallax, o Page Builder Sandwich permite adicionar Planos de Fundo em Vídeo sofisticados simplesmente copiando e colando links do Vimeo ou do YouTube, ou fazendo o upload manual de vídeos.

    Ken Burns Backgrounds

    Você já reparou na forma como as imagens de arquivo são exibidas na maioria dos documentários? Como eles mostram uma imagem na tela, aproximando o zoom lentamente? Isso se chama efeito Ken Burns. E sim, o Page Builder Sandwich também lançou isso em 2017.

    Blank Page Template

    Quer começar do zero? O Page Builder Sandwich tem tudo o que você precisa. Também lançamos o Modelo de Página em Branco em 2017, que permite projetar seu site em uma tela totalmente em branco.

    Full Page Templates

    Page Builder Sandwich released its very first set of Page Templates in January 2017. Niche-based and professionally designed, these templates also allow for manual editing so you can customize them the way you’d like.

    Mobile Responsiveness

    2017 foi o ano em que introduzimos a Responsividade Móvel à nossa lista de recursos. Agora você pode visualizar seu site no celular perfeitamente.

    All 800+ Google Fonts

    Demos a você a capacidade de adicionar um toque especial e flexibilidade ao seu site com mais de 800 fontes do Google Fonts.

    200% Performance Increase

    Bigger, better, faster. Page Builder Sandwich increased its performance by 200% in 2017.

    What’s in Store for 2018?

    O Page Builder Sandwich tem sido o construtor de páginas verdadeiramente fácil de usar, intuitivo e front-end. Nossa visão de oferecer a melhor experiência de criação de páginas da web cresce à medida que vocês compartilham suas necessidades.

    A partir das suas ideias, construímos algo melhor para 2018!

    Frontly Builder is the next step in our evolution and we’re at the final stages of development!

    Leave us your email to get first dibs on updates!

    ‘til relaunch

    Não teríamos chegado tão longe sem o apoio de vocês, então um enorme, enorme obrigado a todos ao nosso lado neste 2017! Um brinde à criação de coisas ainda mais incríveis em 2018. Nos vemos lá!

    Saudações,
    A equipe do Page Builder Sandwich

  • Vamos lançar algo grande muito em breve.

    In a few short months, we’ll be relaunching as Frontly Builder.

    No momento, ele ainda está em intenso desenvolvimento. Mas, mesmo assim, estamos super empolgados para mostrar a vocês no que temos trabalhado. Aqui, vamos falar sobre o porquê de estarmos fazendo essa mudança, como o Frontly será diferente do PBS e o que você precisa ficar de olho.

    Do Page Builder Sandwich para o Frontly Builder

    Before the idea of Sandwich, we noticed a little pattern with page builders everywhere: A lot of them were difficult to use.

    For example, some of these builders would have you go through numerous pop-ups and other settings if you want to add something as simple as an image, a row, a button.

    And if you wanted to change a column’s settings, clicking on the edit button takes you to yet another pop-up that requires you to input settings like size and margins through dropdown options that aren’t very flexible.

    It was frustrating because we knew that page builders should exist to make things easier for users, not the other way around.

    Other wordpress page builders
    Other WordPress Page Builders

    This is how we came up with Page Builder Sandwich.

    We wanted to introduce a builder that was going to maximize users’ experience when creating webpages, allowing them to create awesome things the fast and easy way.

    We received lots of great feedback that allowed Sandwich to evolve. And the more our audience grew, the more suggestions we received on how we could further improve the plugin.

    We were in a state of constant development, and we loved it.

    Page Builder Sandwich has true front-end power, and so will Frontly Builder.

    Redefinindo o que Significa Rodar em Frontend VERDADEIRO

    A evolução do Sandwich foi constante.

    Apart from the feedback (both negative— things we could work on; and positive ones— which we knew we had to retain), Sandwich’s capacity to grow increased, too. We kept finding more and more ideas and solutions to further improve PBS.

    And the more wants and needs from PBS arose, the more our code’s main foundation got tweaked.

    Imagine um sanduíche de verdade com todos os seus recheios favoritos.

    Claro, o sabor seria ótimo, mas como ele vai caber na sua boca? Como ele vai cumprir seu objetivo principal: ser comido?

    This is kind of what happened with PBS. We realized that so much more could be done with it with an even more efficient, stronger foundation. That we could take it further.

    Como mencionamos, o Page Builder Sandwich está em constante estado de evolução.

    Frontly is the next step to that evolution.

    You’ll still get an awesome support team, theme and plugin compatibility, and more.

    LIKE US ON FACEBOOK to see the logo!

    Este Não É um Adeus para o Page Builder Sandwich.

    It’s a hello to Frontly.

    So what makes Frontly different from Page Builder Sandwich?

    We’ve been working really hard to maximize Frontly’s development. The goal now is to make it an insanely better version of PBS — to embody what it means to operate on true front-end.

    Right now, we’re focusing on further improving Frontly’s UX and UI. We’ve worked on giving it a smoother look, a more user-friendly experience, and features that’ll let you build professional-looking websites in even less effort and less time.

    Questions on Frontly?

    We have a short FAQ post you can check out. Add a comment below so we can add your questions to our list!

    Está Chegando Muito em Breve.

    While we’re crazy excited to show you guys what we’ve come up with, we wanna make sure everything is just right for you. So leave us your email to get first dibs on updates, tips and trick, and big promos on the release date.

    We are relaunching as Frontly Builder.

    Leave your email so you don’t miss out.

     

  • Páginas e Plugins: Maximizando Sua Experiência com o WordPress

    pages-and-plugins-maximizing-your-wordpress-experience

    Alguns dos recursos do WordPress (especialmente os mais complexos) podem levar algum tempo para que os usuários mais novos se familiarizem com eles. E se você é um desses novos usuários, o jargão intrincado do WordPress pode ter a tendência de lançá-lo em uma espiral de intimidação, especialmente ao ter aquela sensação quase inevitável de sobrecarga de informações. Que sufoco.

    Agora, se você faz parte dessa porcentagem específica de usuários do WordPress, nós lhe pedimos encarecidamente para não se preocupar; a boa notícia é que não passa de um equívoco pensar que ser um novato no WordPress equivale automaticamente a uma experiência limitada com o WordPress. Essa forma de pensar é um erro comum que quase todo mundo comete, e nós incentivamos você a não cometer esse mesmo erro.

    A verdade é que você não precisa ter um conhecimento tão aprofundado do funcionamento interno de software e código para começar a construir um site — ou fazer com que ele funcione da maneira que você deseja, aliás. “Como isso é possível?”, você pode perguntar. Bem, uma das maneiras pelas quais isso pode ser alcançado é através da criação de páginas em seu site e da adição de plugins.

    O WordPress é tanto complexo quanto conveniente e, por meio de vários dos nossos artigos para iniciantes, nós já cobrimos bastante disso. Anteriormente, também discutimos como os plugins contribuem para a personalização e flexibilidade do WordPress e como eles permitem que seus usuários aproveitem ao máximo sua experiência com o WordPress. E, embora se familiarizar com a importância dos plugins seja fundamental para a sua jornada de criação de sites, os elementos básicos do WordPress — como a existência de páginas — também podem lhe dar um ótimo ponto de partida.

    20160824_Una_PBS_Article_2

    Definindo Páginas VS Posts

    No universo do WordPress, o termo “página” está quase sempre associado ao termo “post” — como em “páginas e posts” — e há momentos em que as pessoas os confundem como termos intercambiáveis. É compreensível que seja fácil se confundir entre os dois (especialmente se você ainda estiver dando os primeiros passos na parte rasa da piscina dos iniciantes no WordPress). Portanto, com isso em mente, observe que, embora essas coisas possam parecer triviais, é sempre uma boa ideia se familiarizar com os pequenos detalhes do WordPress, especialmente se você estiver apenas começando.

    Uma maneira fácil de diferenciar posts de páginas é que os posts são as entradas individuais que você cria em seu site (este artigo que você está lendo agora, por exemplo, é um post). Essas entradas não são exatamente uma necessidade para sites, a menos que o seu tenha um blog ativo como o nosso. No entanto, o que pode ser um elemento crucial do seu site é a configuração de páginas, que é no que este artigo estará um pouco mais focado.

    Páginas são Blocos de Construção

    A menos que você nunca tenha tocado em um computador antes (o que presumimos ser improvável), é provável que você já tenha visto ou ouvido falar de páginas de sites antes, ou pelo menos tenha uma boa ideia do que elas possam ser. Se você não estiver familiarizado, não se preocupe; também é provável que você já tenha se deparado com páginas em suas visitas a outros sites: seções de FAQ e/ou Sobre, formulários de contato e galerias de fotos. Para iniciantes e sites recém-criados, elas podem ser semelhantes a blocos de construção, em certo sentido. Se combinadas, formam os elementos essenciais do que o seu site trata e o que ele tem a oferecer.

    Portanto, é ótimo estar ciente dessas diferenças básicas, sim. Mas, combinado com o seu conhecimento básico sobre plugins, você está, na verdade, em uma posição perfeita para aproveitar seu novo conhecimento sobre páginas do WordPress, mesmo sendo um iniciante. A questão agora, porém, é como.

    20160824_Una_PBS_Article_1

    Tirando Proveito: Plugins Básicos que Você Pode Instalar

    Em um site WordPress básico, criar páginas é fácil, com certeza. Você só precisa ir explorando, ler algumas instruções, clicar em alguns botões e pronto. No entanto, se você quiser algo além disso, terá que instalar alguns plugins.

    1. Plugins de SEO (Otimização para Mecanismos de Busca)

    Colocar seu site no ar e torná-lo visível já é difícil o suficiente, e a tarefa de divulgar o seu site é muito mais difícil. Acredite em mim. É por isso que uma ajudinha dos plugins de SEO é crucial para que seu site ganhe esse impulso no ranking.

    Aqui no Sandwich, usamos o Yoast, que costuma ser apontado como o principal plugin de SEO do mercado atualmente. No entanto, há vários outros plugins de SEO para escolher, e existem inúmeros sites, como o SitePoint, que comparam e contrastam os diferentes plugins de SEO caso você queira avaliar suas opções.

    1. Plugins de Backup

    Fazer backup é uma das precauções mais importantes que você deve tomar ao configurar seu site; todo cuidado é pouco. Afinal, é melhor levar alguns minutos (ou horas, dependendo da sua experiência) para configurar um bom plugin de backup do que passar uma eternidade configurando seu site tudo de novo se seus dados forem apagados acidentalmente.

    1. Plugins de segurança

    É um mundo cruel lá fora, mesmo no reino da internet. Pessoas mal-intencionadas vão querer roubar seus dados e até invadir seu site, entre outras coisas. Por isso, é sempre uma boa ideia instalar um plugin de segurança junto com o seu backup, por precaução. Usamos o VaultPress tanto para backup quanto para segurança.

    1. Plugins antispam

    Ninguém quer spam, a menos que seja a comida. Delicioso.

    Bem, deixando de lado os famosos enlatados, existem muitas maneiras pelas quais o spam indesejado pode se infiltrar no seu site WordPress. De acordo com o WPExplorer, embora seja possível ajustar manualmente o WordPress para evitar spam, você também pode optar por uma solução mais rápida: instalar um plugin antispam para o seu site.

    1. Cache

    Instalar um plugin de cache é uma maneira infalível de acelerar o desempenho do seu site e do seu servidor. Nós temos usado o WP Fastest Cache já há algum tempo, mas também existem muitos outros plugins de cache confiáveis e bem avaliados — como o W3 Total Cache — que você também pode experimentar.

    Você pode aprender mais sobre cache no site do WordPress Codex.

    CURIOSIDADE: Cache é pronunciado ˈkash e não kashè

    Plugins Adicionais para as Suas Páginas

    1. Plugin de Formulário de Contato

    Como proprietário do site, você é responsável por responder às dúvidas do seu público e dar retorno às sugestões dele. Portanto, em algum momento após a sua jornada de criação do site, eles podem querer — ou até precisar — entrar em contato com você; e é para isso que servem os plugins de formulário de contato. Embora seja possível criar um formulário de contato para o seu site do zero, temos que admitir que há momentos em que fazer isso não seria muito prático, considerando que com certeza levará algum tempo para você fazer isso, especialmente se for iniciante.

    WPBeginner tem uma lista do que eles consideram os melhores plugins de formulário de contato do mercado, enquanto o Site Point tem um artigo semelhante sobre os que estão disponíveis gratuitamente.

    2. Plugin de Redes Sociais

    A menos que você seja um site que as pessoas visitam em massa com frequência, é reconhecidamente um pouco desafiador fazer com que o conteúdo do seu site (como artigos) circule por aí. É por isso que há momentos em que surge a necessidade de um plugin de redes sociais. O mais provável é que, se o seu público achar o seu conteúdo interessante o suficiente, ele queira compartilhá-lo com os amigos nas redes sociais.

    3. Ferramentas de Comentários / Disqus

    Como mencionamos, comunicar-se com seu público é essencial, especialmente se o conteúdo do seu site gira em torno de artigos especiais. Conhecer seu público também lhe dá uma vantagem; você pode usar qualquer feedback que eles tiverem para melhorar seu site e/ou seus produtos.

    O Disqus é uma ferramenta de comentários muito popular e uma das mais conhecidas do mercado. O Kikolani também tem um artigo muito útil que pode ajudá-lo a decidir qual ferramenta de comentários funcionará melhor para o seu site.

    Existem Mais Plugins do que Você Imagina

    A lista de plugins disponíveis para sites WordPress não para neste artigo. Estes são apenas alguns que achamos muito úteis; o universo dos plugins do WordPress definitivamente abriga mais do que os oito que listamos acima.

    Dito isso, provavelmente não conseguimos cobrir tudo. Então, você tem algum plugin em mente que acha que deveria estar na lista? Conte para nós na seção de comentários abaixo, e podemos incluir suas sugestões em um de nossos artigos futuros!

    Boa criação de sites!

  • #PBSUpdate: Templates de Página Inteira Baseados em Nichos

    PBS Version 4.0 has been our biggest update yet, and with its release, we’ve included a new game-changing feature, the Full Page, Niche-Based Templates.

    The Full Page Templates are a set of 10 professionally designed, niche-based templates. They’re ready to use upon downloading PBS, and can be used as is, or may be tweaked to fit your taste.

    Use as a Starting Point for Your Page

    O uso de modelos é uma das maneiras mais eficientes de produzir páginas da web. Eles são comumente oferecidos como uma solução rápida para problemas relacionados ao design e layout do site, oferecendo ao usuário várias opções (geralmente com temas diferentes) para escolher. Com a atualização da Versão 4.0, o Page Builder Sandwich finalmente lançou um conjunto próprio.

    A screenshot of one of our templates, the PBS Farm Template

    The Benefits

    Os Modelos de Página Inteira do PBS são feitos sob medida para aliviar o fardo de criar sua página da web do zero. Cada modelo é projetado para atender a um nicho específico, contendo elementos adequados para um setor específico. Por exemplo, o modelo Hotel inclui recursos como Google Maps, formulário de contato e seções projetadas para destacar as comodidades do seu hotel. O modelo Fashion, por outro lado, inclui um carrossel onde você pode exibir seus produtos mais recentes com seus preços abaixo.

    Tweak, Tweak, Tweak

    Como os modelos são pré-concebidos, eles também facilitam o processo de construção de páginas, economizando tempo e recursos. Mas se o modelo escolhido não incluir um recurso que você deseja na sua página (como se quiser um cabeçalho hero com vídeo de fundo para o Modelo Industrial), não precisa se preocupar. Você pode simplesmente ajustar o design do modelo para atender ao seu gosto e às suas necessidades, ajustando as propriedades dos elementos diretamente no PBS.

    A section of the PBS Farm Template with tweaked colors and different photo that may cater to a different niche

    The 10 templates we currently have available (we’ll be releasing more soon!) are themed according to the following common niches and industries:

    1. Hotel Template

    • For hotels, spas, or similar business.
    • Includes video background hero header, carousel testimonials, contact form, Google Map, and more.

    2. Law/Corporate Template

    • For law firms and other corporate businesses.
    • Includes about us section, carousel testimonials, meet the team section, and more.

    3. Fashion Template

    • Use for online clothing stores and other e-commerce sites. Includes featured products carousel, call–to–action buttons, latest blogpost previews, and more.
    • Includes featured products carousel, call–to–action buttons, latest blogpost previews, and more.

    4. Farm Template

    • Ideal for subscription e–commerce sites.
    • Includes promo header, call–to–action buttons, subscription plan sections, and more.

    5. Restaurant Template

    • Perfect for restaurants and other delivery service businesses.
    • Includes hero header with space for delivery numbers, menu section, business hours section, and more.

    6. Concert Template

    • Ideal for concerts and other big events or gatherings.
    • Includes countdown, video background, affiliates section, prices section, subscription button, and more.

    7. Forum Template

    • Use for communities, small organizations, and more.Includes call-to-action buttons, about section, count up, meet the team section, and more.
    • Includes call-to-action buttons, about section, count up, meet the team section, and more.

    8. Portfolio Template

    • For photography or art portfolios, and more.
    • Includes iconified skillset section, gallery, social media buttons, and more.

    9. Industrial Template

    • Use for industrial or manufacturing businesses, and more.
    • Includes hero header with video background, about us/featured product sections, carousel testimonials, and more.

    10. Wedding Template

    • Perfect for weddings and other small intimate events.
    • Includes hero header with video background, photo gallery, RSVP section, Google Map, and more.

    Some samples of PBS’ Full Page Templates: the Law, Forum, and Hotel Templates

    The Future of Full Page Templates

    Embora tenhamos 10 modelos disponíveis no momento, estamos no processo de criar mais. Queremos cobrir todos os nichos e setores comuns, é claro, mas se você tiver alguma sugestão, sinta-se à vontade para nos enviar uma mensagem.

    Boa criação de sites!

  • Frontly Builder: Perguntas frequentes

    A few months ago, we announced the launch Frontly Builder, a bigger, better front-end page builder with increased performance and awesome new stuff. Think of it as a new and improved version of Page Builder Sandwich.

    Ainda está em desenvolvimento, mas será lançado em breve. Enquanto isso, temos certeza de que vocês têm algumas dúvidas sobre o Frontly. Então, aqui está um breve FAQ para todos!

    What will happen to my PBS-run site?/Will I lose everything I’ve built using PBS?/Will the Frontly update destroy my website?

    • No, definitely not! Everything you’ve made using Page Builder Sandwich will remain intact, and nothing will change.

    I purchased Page Builder Sandwich before the Frontly release. What do I do?

    • The only thing you have to do is… nothing. For current PBS users, Frontly will be released as an “update”. You’ll just be upgraded to a “better” version of PBS- Frontly.

    Will I have to repurchase Frontly?

    • No. If you’ve purchased PBS before the Frontly release, you don’t need to purchase anything. As mentioned, everything will be released as an “update” for old users, so you won’t have to lift a finger or shell anything out- we’ve sorted everything out for you guys. ?

    Por enquanto é isso! Se vocês tiverem mais dúvidas, deixem um comentário abaixo para que possamos adicionar a esta lista de FAQs.

    Esperamos que vocês estejam tão animados com o Frontly quanto nós! Nos vemos lá. ?

    Deixe seu e-mail para receber as novidades em primeira mão!

  • Como Adicionar o Efeito Parallax, Vídeo de Fundo e o Efeito Ken Burns

    O Page Builder Sandwich tem um recurso que nós coletivamente gostamos de chamar de Fancy Background Effects (Efeitos Especiais de Fundo). Há três deles: o Efeito Parallax, Fundos de Vídeo e o Efeito Ken Burns.

    What are the different Fancy Background Effects?

    Os Fancy Background Effects do PBS dão ao seu site o impulso necessário para atrair visitantes. Eles são uma maneira infalível de chamar a atenção e, quando executados corretamente, podem gerar resultados impressionantes no tráfego do site.

    O Efeito Parallax

    Implementar o Efeito Parallax na sua página dá ao plano de fundo uma sensação de profundidade, fazendo com que certos elementos do seu site se “destaquem” durante a rolagem. Aqui está um exemplo de uma página com um fundo parallax implementado e outra sem.

    With Parallax Scrolling

    The background image scrolls at a different rate as the rest of the elements in the page.

    Without Parallax Scrolling

    The elements of the web page – the text, images, buttons, etc – all scroll at the same rate as the background.

    Video Backgrounds

    Os Fundos de Vídeo permitem que você coloque vídeos em repetição nos planos de fundo em vez de imagens estáticas. O melhor dos fundos de vídeo do PBS é que basta colar o link desejado do YouTube ou Vimeo quando solicitado, e nós o transformaremos em um plano de fundo de vídeo para você. Você também pode enviar seus próprios vídeos para isso.

    Alguns exemplos de fundos de vídeo que você pode conferir:

    The Ken Burns Effect

    Ken Burns, who popularized the Ken Burns effect in film.

    In documentaries, do you ever notice when they show photos that slowly zoom into detail? That’s called the Ken Burns Effect. You can access these effects on Page Builder Sandwich, too.

    How do I add the Fancy Background Effects?

    Você pode encontrar todos os Fancy Background Effects seguindo os seguintes passos:

    Step 1: Choose a row you’d like to add an effect on. Click on this row’s settings button (the gear icon on the left). This will open the Properties Inspector.

    Step 2: Once the Properties Inspector pops up, scroll down a bit until you find the option called “Fancy Background Effects”.

    Step 3: Once you’ve found it, you’ll see that you can click a dropdown button and select which background effect you’d like on your row.

    Step 4: Depending on which Fancy Background Effect you choose, you can adjust each effect’s settings. For example, for the Parallax effect, you can adjust its height and position.

    E pronto! Depois disso, você verá seus Fancy Background Effects aparecerem no seu site a todo vapor.

    Have you used PBS’ Fancy Backgrounds yet?

    Há algum outro efeito de fundo que você gostaria de sugerir para adicionarmos aos nossos recursos? Ou gostaria de nos mostrar seu site feito com o PBS usando um dos efeitos? Conte para nós na seção de comentários abaixo!

  • Rolagem Parallax: O Que É?

    The parallax scrolling effect is a design technique that’s relatively new in development and web design. Over the past few years since it’s hit the scene though, it’s grown pretty popular in its own right, and with good reason, too.

    Definição de Parallax Scrolling

    Parallax scrolling is a technique wherein your web page’s background image scrolls at a slower rate compared to the foreground image. It gives the user a unique sense of depth and action while scrolling through a page when used on a website.

    Without Parallax Scrolling

    The elements of the web page – the text, images, buttons, etc – all scroll at the same rate as the background.

    With Parallax Scrolling

    The background image scrolls at a different rate as the rest of the elements in the page.

    O Impacto do Parallax Scrolling no Usuário

    A técnica não é exatamente nova, no entanto, e já era usada na animação tradicional desde a década de 1920. Também foi utilizada em muitos videogames clássicos, como Super Mario Bros.

    No universo do web design, porém, a Nike costuma ser creditada como uma das primeiras a usar o parallax scrolling em 2011. Desde então, o termo “parallax scrolling” (às vezes chamado de “fundo/s em parallax”) tornou-se comum entre designers e desenvolvedores, crescendo constantemente em popularidade.

    Parallax scrolling as used in a version of Super Mario Brothers. Notice how the hills in the background move
    in slightly varying speeds, as compared to Mario and the other characters in the foreground.

    O Que o Usuário Ganha com Isso

    O melhor desse efeito é que ele incentiva os usuários a interagirem com o seu site, aumentando tanto o engajamento quanto a atratividade. E, quando feito da maneira correta, o parallax scrolling pode dar vida até mesmo aos sites mais simples. Ele pode até ser usado para criar narrativas impressionantes que prendem imediatamente a atenção de todos os visitantes do site.

    Compartilhe Seu Trabalho Conosco!

    E então, o que vocês acham? Vocês já usaram o mais novo recurso de fundo em parallax do PBS v4? Está funcionando bem para você? Sinta-se à vontade para compartilhar o link do seu trabalho ou deixar sugestões na seção de comentários abaixo.

    Boa criação de sites!