O Page Builder Sandwich deve ser compatível com os diferentes módulos do Jetpack.
O Módulo Markdown faz algo especial ao salvar o conteúdo, o que resulta na perda de alterações durante a conversão de markdown. Para lidar com isso, o texto em markdown no editor do backend se transforma em tags html ao salvar suas alterações a partir do frontend. (Agradecimentos a Jake Jackson pela ajuda)
Nós testamos o Page Builder Sandwich com o PHP 7 e tudo deve funcionar perfeitamente sem problemas.
Tenha cuidado ao atualizar o seu site de uma versão inferior para o PHP 7, pois há muitas incompatibilidades com versões inferiores que devem ser verificadas em todos os seus temas e plugins.
Há um erro de Javascript que ocorre quando o Page Builder Sandwich e o Materialize estão juntos. Existe um conflito entre o materialize.js e o seletor de cores do WordPress Core.
Existe uma issue no repositório do GitHub do Materialize sobre isso: https://github.com/Dogfalo/materialize/issues/2821
O plugin continuará funcionando normalmente desde que você não desative a licença no seu site. Uma vez desativada, você não poderá reativá-la novamente.
Você não poderá receber atualizações do seu painel do WordPress, nem terá acesso a versões mais recentes. Não poderemos oferecer nosso incrível suporte personalizado.
Adicionar widgets pode ser feito clicando no botão Widget Element na seção Elements no inspetor. Ao clicar, um pop-up deve aparecer listando todos os widgets que o Page Builder Sandwich encontrou em seu site.
Todos os widgets encontrados no seu site WordPress podem ser adicionados; no entanto, alguns widgets que usam código Javascript personalizado/especializado em suas configurações podem não funcionar corretamente. Widgets que utilizam o seguinte podem não funcionar:
Os widgets padrão do WordPress e widgets criados de forma semelhante não devem ter problemas.
Se você realmente precisa que esse widget específico funcione, existe uma solução alternativa para isso.
Você pode usar o plugin Custom Sidebars by WPMU Dev para criar uma nova área de barra lateral/widget e adicionar seu widget lá usando o método normal em Aparência > Widgets. Em seguida, no Page Builder Sandwich, adicione um Sidebar Element e selecione a barra lateral que contém o widget que você precisa.
Outra alternativa é recriar o efeito desejado usando os vários elementos e estilos disponíveis no Page Builder Sandwich.
Quando você comprar o Page Builder Sandwich pela primeira vez, um arquivo .zip contendo o plugin será baixado automaticamente no seu computador.
Caso perca este arquivo, você poderá baixar seu arquivo .zip novamente acessando este link: https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/
Inserir sua licença neste link permitirá recuperar seu arquivo .zip do Page Builder Sandwich, juntamente com sua licença e detalhes da conta.
Tecnicamente, isso deve funcionar com todo e qualquer tema.
Junto com nossos usuários e clientes, usamos com sucesso o Page Builder Sandwich com muitos temas, incluindo temas do repositório de temas do WordPress.org, Genesis Themes, StudioPress Themes, Elegant Themes e temas do ThemeForest.
No entanto, pode haver momentos em que seu tema esteja fazendo algo não convencional e possa impedir o Page Builder Sandwich de funcionar corretamente. Quando isso acontecer, envie-nos uma solicitação de suporte e tentaremos corrigir.
Excluir coisas no Page Builder Sandwich geralmente é feito simplesmente selecionando o texto ou elemento e, em seguida, pressionando a tecla delete ou backspace.
Outra alternativa é clicar no botão de excluir / remover no inspetor:
Há alguns casos em que isso não funciona. Os itens que não funcionam são normalmente contêineres como linhas, colunas ou carrosséis. Isso serve para evitar exclusões acidentais ao excluir conteúdo.
Para excluir esses itens, clique no botão excluir / remover nas propriedades do elemento no inspetor. Por exemplo, para excluir uma linha, você terá que usar esta área:
Adicionar imagens é muito simples. Você pode:
O Page Builder Sandwich agora está disponível em:
Se você gostaria de ajudar a contribuir com o Page Builder Sandwich traduzindo-o para o seu idioma, acesse a nossa página do Transifex!
Existem milhares de temas e outros plugins por aí. Por isso, embora tentemos ser cuidadosos e construir tudo dentro dos padrões, às vezes as coisas podem dar errado.
Se você perceber que o Page Builder Sandwich não está funcionando corretamente na sua configuração, aqui estão alguns passos que você pode seguir para solucionar o problema.
Confira o artigo aqui: O botão “Edit with Page Builder Sandwich” não aparece Se isso não resolver o problema, continue lendo.
Navegue pelos diferentes artigos na categoria de solução de problemas na documentação.
O WordPress, seus plugins, seu tema e até mesmo o Page Builder Sandwich. É sempre bom manter tudo atualizado. Certificar-se de que suas ferramentas estejam atualizadas significa que você terá as correções de bugs e vulnerabilidades mais recentes para o seu site.
Se você não conseguir editar seu conteúdo com o Page Builder Sandwich (e provavelmente uma janela pop-up de erro tiver aparecido), pode ser que todo o conteúdo da página atual em que você está seja gerado pelo seu tema / por um plugin. Para verificar isso, edite sua página/post no backend normalmente usando o WordPress e depois verifique se o conteúdo salvo aparece no frontend. Se não aparecer, isso significa que o conteúdo da página/post é totalmente gerado e não pode ser editado usando o PBS.
Às vezes, um plugin pode apresentar algum conflito com o Page Builder Sandwich. Para verificar qual plugin pode estar causando o conflito, desative um plugin e veja se o PBS volta a funcionar. Faça isso para cada um dos seus plugins ativados. Se o PBS começar a funcionar novamente e você puder editar suas páginas, o plugin que você acabou de desativar não é compatível com o PBS. Nesses casos, entre em contato conosco por e-mail em [email protected] e nos avise para que possamos corrigir isso.
Se desativar os plugins não adiantou nada, tente mudar seu tema para o tema padrão do WordPress (os temas Twenty-Something). Se você conseguir voltar a editar seu conteúdo com o Page Builder Sandwich, o tema que você está usando não é compatível com o PBS. Envie-nos essas informações por e-mail em [email protected] e nos avise para que possamos corrigir isso.
Em casos raros, uma extensão do navegador pode impedir que o código Javascript de um site funcione corretamente. Para verificar se uma extensão do navegador está causando problemas, abra seu navegador no modo anônimo (Chrome) ou no modo privado e tente acessar o PBS; isso abrirá uma nova aba sem extensões. Se funcionar, então você tem uma extensão conflitante.
Constatou-se que a extensão de navegador PageXray causa problemas.
Houve um problema anterior relacionado ao NextGen e ao Page Builder Sandwich.
Antes da versão 2.12, o PBS de alguma forma fazia com que o NextGen exibisse uma mensagem de erro que deixava seu site com uma tela branca em branco. Isso foi corrigido a partir da versão 2.12, portanto, se você estiver usando uma versão mais antiga, atualize.
Garantimos que o Page Builder Sandwich tenha um impacto quase nulo no desempenho do seu site. Quando desconectado, no mínimo, apenas os estilos CSS de linha e coluna são enfileirados, juntamente com os scripts JS e CSS necessários para os shortcodes que você utilizou.
O Markdown é basicamente uma sintaxe que você digita enquanto edita para adicionar ou alterar a formatação do seu texto. São como teclas de atalho, mas em vez de pressionar a combinação, você as digita.
Abaixo está uma lista de todas as sintaxes Markdown suportadas no Page Builder Sandwich.
## Título2
### Título3
até:
###### Título6
> Citação em bloco
(4 espaços)Texto pré-formatado/Código
* Lista com marcadores - Lista com marcadores
1. Lista numerada 1) Lista numerada
- ------------------------------(ou múltiplos traços)
Digitar URLs converterá automaticamente em um link:
Acesse https://pagebuildersandwich.com
Acesse [Page Builder Sandwich](https://pagebuildersandwich.com
Os shortcodes podem ser colados ou digitados diretamente durante a edição. Depois de digitar seu shortcode, pressione Enter ou saia do shortcode e ele deverá aparecer em sua forma renderizada imediatamente.
Outra maneira de adicionar shortcodes é clicar no Elemento de Shortcode no seu inspetor. Isso exibirá um pop-up que lista todos os shortcodes disponíveis no seu site. Selecione um ou dê um duplo clique em qualquer um deles para inseri-lo.
Você pode editar shortcodes de 2 maneiras:
Os atributos de shortcode não podem ser detectados pelo Page Builder Sandwich. Portanto, você terá que digitá-los. Estamos trabalhando em uma maneira de mapear os shortcodes no sistema para facilitar para todos. Fique atento a essa novidade.
Você pode incorporar conteúdo de vários sites, como vídeos do YouTube, vídeos do Vimeo, fotos do Instagram, fotos do Flickr, Tweets e até comentários do Reddit, colando diretamente as URLs de seus links permanentes.
https://www.youtube.com/watch?v=dQw4w9WgXcQ
Você pode encontrar uma lista de URLs incorporáveis no codex do WordPress: https://codex.wordpress.org/Embeds
Você também pode instalar outros plugins que adicionam suporte a URLs de incorporação adicionais. Por exemplo, URLs do Wistia não são suportadas pelo WordPress por padrão; você pode instalar o plugin deles para habilitar a incorporação e, depois disso, o PB Sandwich também deverá ser capaz de processá-las.
Observe que uma linha inteira de texto deve conter apenas a URL para que isso funcione.
Você também pode colar os códigos de incorporação diretamente.
Os códigos de incorporação se parecem com isto:
<iframe width="420" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>
Observe que uma linha inteira de texto deve conter apenas o código de incorporação para que isso funcione.
Clique na ferramenta “Adicionar mídia” e cole sua URL na aba “Inserir a partir do URL”.
Você pode incorporar conteúdo de vários sites, como vídeos do YouTube, vídeos do Vimeo, Tweets e até mesmo comentários do Reddit, colando suas URLs de link permanente no Page Builder Sandwich.
Observe que uma linha inteira de texto deve conter apenas a URL
O Page Builder Sandwich funciona em conjunto com o recurso de oEmbed do WordPress. Portanto, URLs que você pode incorporar no backend devem ser suportadas. Plugins que adicionam suporte a provedores adicionais de oEmbed também devem funcionar.
Você pode encontrar uma lista de provedores de oEmbed no codex: https://codex.wordpress.org/Embeds
Você só pode editar o conteúdo de páginas, posts e tipos de post personalizados usando o Page Builder Sandwich.
No entanto, você não pode editar arquivos de modelo do tema como:
Pense desta forma: se houver um “Editar post” ou “Editar página” na sua barra de administração no frontend, a página deverá ser editável.
Na versão premium do Page Builder Sandwich, você pode usar seus próprios ícones SVG / vetoriais. Veja como:
Os ícones enviados também podem ser usados como marcadores em listas com marcadores e ícones de botões.
Observação: Se o seu ícone não aparecer nas suas pesquisas, pode ser que o nome do arquivo não tenha sido analisado corretamente pelo PBS. Nesses casos, você pode usar os termos “custom” ou “upload” para encontrar seus ícones enviados.
O Page Builder Sandwich foi criado para ser o menos intrusivo possível, de modo que outros plugins não devem ter problemas para coexistir com o nosso.
Às vezes, porém, há exceções a isso. Abaixo está uma lista de plugins que apresentam algumas peculiaridades ao funcionar junto com o Page Builder Sandwich. Isso não significa necessariamente que eles não funcionem ou que sejam incompatíveis, mas apenas que alguns comportamentos podem ser diferentes.
Continuaremos atualizando esta lista. Se você encontrou algo, sinta-se à vontade para enviar um ticket de suporte para [email protected]
Verifica se o PBS está ativado e no modo de edição.
if ( PBSEditor.isEditing() ) {
// Do something when editing.
}
Nenhum.
Boolean. Verdadeiro quando estiver editando atualmente, falso quando não estiver editando.
Usado dentro do iframe utilizado pelo PBS para renderizar sua visualização responsiva durante a edição. Isso é chamado logo antes do fechamento da tag <head> e pode ser usado para adicionar scripts e estilos.
Nenhum.
add_action( 'pbs_iframe_header', 'change_bg_color' );
function change_bg_color() {
?>
<style>
body {
background-color: hotpink;
}
</style>
<?php
}
Se você estiver com problemas, estamos aqui para ajudar! Mas, por favor, consulte primeiro as páginas de documentação; você pode encontrar a resposta aqui e economizar tempo.
Envie suas dúvidas de suporte por e-mail para [email protected]
Você pode impedir que o PB Sandwich apareça no front-end usando o filtro pbs_is_editable_by_user.
Por exemplo, para impedir que o PB Sandwich apareça em um Custom Post Type identificado pelo slug slider, você pode adicionar este trecho de código no seu functions.php
add_filter( 'pbs_is_editable_by_user', 'stop_pbs_in_sliders' );
function stop_pbs_in_sliders( $editable ) {
if ( is_singular( 'slider' ) ) {
return false;
}
return $editable;
}
Para impedir o PB Sandwich em uma página/post específico, você pode usar o ID do post para verificar:
add_filter( 'pbs_is_editable_by_user', 'stop_pbs_for_123' );
function stop_pbs_for_123( $editable ) {
global $post;
if ( is_singular() && ! empty( $post ) ) {
if ( '123' === $post->ID ) {
return false;
}
}
return $editable;
}
Acionado quando o usuário alterna entre as diferentes visualizações responsivas.
Nenhum.
O PBS envia estatísticas de uso para usuários que optaram por participar sempre que eles salvam no editor do PBS. Este filtro pode ser usado para interromper o envio de dados.
$true
Booleano. Isso é sempre verdadeiro.
Se você estiver com problemas, estamos aqui para ajudar! Mas primeiro verifique as páginas de documentação, você pode encontrar a resposta aqui e economizar tempo.
Envie suas dúvidas de suporte por e-mail para [email protected]
$all_shortcodes = PageBuilderSandwich::get_all_shortcodes()
Nenhum.
Array. Um array com todas as tags de shortcode detectadas.
PBS >= 4.3
O PBS adiciona um wrapper para identificar a área de conteúdo de um post. Isso é chamado antes de o wrapper ser inserido.
$content
String. O conteúdo do post com o wrapper aplicado.
PBS >= 4.3
Substitui a decisão de carregar ou não o PBS no front-end e permitir que o usuário use o PBS para editar o post.
$is_editable
Booleano. True se o post deve ser editável com o PBS. False caso contrário
Não permitir que post_types portfolio sejam editáveis com o PBS
add_filter( 'pbs_is_editable_by_user', 'disallow_portfolios' );
function disallow_portfolios( $is_editable ) {
global $post;
if ( $post ) {
if ( 'portfolio' === get_post_type( $post ) ) {
return false;
}
}
return $is_editable;
}
Usado dentro do iframe utilizado pelo PBS para renderizar sua visualização responsiva durante a edição. Isso é chamado logo antes do fechamento da tag <body> e pode ser usado para adicionar scripts e estilos.
Nenhum.
O PBS adiciona um wrapper para identificar a área de conteúdo de um post. Isso é chamado após o wrapper ser inserido.
$content
String. O conteúdo do post com o wrapper aplicado.
PBS >= 4.3
Obtém a instância de PageBuilderSandwich
$pbs = PageBuilderSandwich::instance()
Nenhum.
Objeto PageBuilderSandwich. A instância atual da classe PBS.
PageBuilderSandwich::is_editable_by_user()
Nenhum.
Booleano. True se o PBS puder editar o post, false caso contrário.
Um filtro para modificar os estilos CSS que estão sendo salvos para um post. Isso é chamado quando um salvamento foi iniciado a partir do editor do PBS.
$style
String. Os estilos CSS enviados para salvamento.
$post_id
Int. O id do post que estamos salvando.
Chamado quando o editor do PBS termina de carregar (não é chamado quando o usuário clica no botão de iniciar edição)
Fazer algo depois que o PBS carregar
wp.hooks.addAction( 'pbs.init', function() {
console.log( 'PBS is ready!' );
}
Uma lista de tags de shortcode para ocultar no seletor de shortcodes do PBS. Use isso se você tiver shortcodes exibidos no pop-up do seletor que já foram descontinuados ou que você simplesmente deseja ocultar dos usuários.
$shortcodes
Array. Um array de tags de shortcode.
Ocultar o shortcode do seletor.
add_filter( 'pbs_shortcodes_to_hide_in_picker, 'hide_embed_shortcode' );
function hide_embed_shortcode( $shortcodes ) {
$shortcodes[] = 'embed';
return $shortcodes;
}
Adiciona propriedades Javascript ao objeto pbsFrontendParams no front-end. O objeto pbsFrontendParams fica disponível no front-end independentemente de o usuário estar logado e editando.
$params
Array. Um array de chaves e valores que ficarão disponíveis na variável Javascript de nível de janela (window) pbsFrontendParams
Tornar uma variável acessível no front-end
add_filter( 'pbs_localize_frontend_scripts, 'add_my_property' );
function add_my_property( $params ) {
// This will be available in Javascript under pbsFrontendParams.myProperty
$params['myProperty'] = 'My Property';
return $params;
}
A maior parte do Page Builder Sandwich é Javascript, e adicionamos uma série de métodos para que os desenvolvedores possam estender e adicionar mais funcionalidades ao nosso construtor de páginas.
Para facilitar as coisas para os desenvolvedores, padronizamos as coisas de acordo com a forma como o WordPress faz — por meio de hooks!
No WordPress, você normalmente usa as funções add_filter() e add_action() para modificar ou adicionar comportamentos ao WP. Da mesma forma no PBS, você pode usar wp.hooks.addFilter() e wp.hooks.addAction().
A maneira de usá-los também é a mesma: use filtros para modificar coisas e use ações para realizar tarefas adicionais. Essas duas chamadas de função são essencialmente iguais às suas equivalentes em PHP, exceto pelo fato de rodarem em Javascript.
Para não haver confusão entre hooks PHP e hooks Javascript, nomeamos os hooks Javascript com “period-case” (termo inventado). Todos os hooks PHP usam snake case:
Consulte as categorias Javascript Actions e Javascript Filters no menu à esquerda para navegar por todos os hooks.
Para os curiosos, estamos usando https://github.com/carldanley/WP-JS-Hooks para adicionar essas práticas chamadas de hook em Javascript
Chamado logo antes do editor salvar o conteúdo. Você pode usar isso para incluir dados adicionais a serem enviados durante o salvamento (isso não salva os dados, apenas os envia via Ajax para o backend)
payload
Objeto FormData. Os dados enviados via Ajax para salvamento.
wp.hooks.addAction( 'pbs.save.payload', function( payload ) {
// Adiciona dados a serem enviados durante o salvamento.
payload.append( 'my_data', 'My Data' );
}
Enfileira um script ou estilo junto com o PBS. Isso é chamado apenas quando o post é editável com o PBS. Quando a página não é editável com o PBS, isso não é usado de forma alguma.
Nenhum.
Quando o PBS carregar, também enfileire my-script.js
add_action( 'pbs_enqueue_scripts, 'add_my_script' );
function add_my_script() {
wp_enqueue_script( 'my-script' , plugins_url( 'js/my-script.js', __FILE__ ) );
}
Adiciona propriedades Javascript ao objeto pbsParams no front-end. O objeto pbsParams está disponível no front-end quando o usuário está conectado e tem permissão para editar a página.
Esta variável também carrega muitas das propriedades usadas pelo PBS durante a edição, como nonces, uma lista de todos os shortcodes carregados e strings de tradução.
$params
Array. Um array de chaves e valores que ficarão disponíveis na variável Javascript em nível de window pbsParams
Adicionar um shortcode não detectado ao editor
add_filter( 'pbs_frontend_scripts, 'add_my_shortcode' );
function add_my_shortcode( $params ) {
$params['shortcodes'][] = 'my_shortcode';
return $params;
}
Se você não conseguir encontrar onde guardou sua cópia do plugin premium, pode acessar aqui e inserir seu endereço de e-mail para recuperá-lo. O plugin será enviado para você por e-mail.
https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/
Este é um recurso premium e está disponível na versão 4.0.1+
Links âncora com rolagem na mesma página são links que apontam para um local específico na mesma página. Quando você clica em um link na mesma página, seu navegador rolará até a área indicada.
Você precisa de duas coisas para criar um link âncora na mesma página:
Escolha qualquer elemento próximo ao final da sua página e abra suas propriedades. Na área avançada, adicione uma classe personalizada ou ID personalizado chamado ” go_here“
Agora crie um link ou adicione um elemento de botão em algum lugar próximo ao topo da sua página. Em vez de adicionar uma URL como link, use ” .go_here” (com o ponto) se tiver adicionado “go_here” como uma classe personalizada; ou use “#go_here” (com a hashtag) se tiver adicionado como um ID personalizado.
Depois de salvar sua página, ao clicar no seu link/botão, ela deverá rolar suavemente até o elemento na parte inferior da sua página.
Âncoras nomeadas como
<a name="go_here"></a>
também podem ser direcionadas adicionando um link para “#go_here” (com a hashtag)
Você também pode direcionar para quaisquer outras áreas da sua página, mesmo fora da área do editor, desde que as direcione usando seus nomes de classe ou IDs.
Chamado após o conteúdo ser salvo. Isso é chamado quando um salvamento foi iniciado a partir do editor do PBS.
Nenhum
Um filtro para modificar os dados do post a serem salvos. Isso é chamado quando um salvamento foi iniciado a partir do editor do PBS.
$post_data
Array. Os dados finais do post a serem salvos, isso é passado diretamente para wp_update_post() em seguida.
$_POST
Array. Os dados brutos do post enviados do editor para salvamento. Isso já teve o nonce verificado.
$post_id
Int. O ID do post que estamos salvando.
add_filter( 'pbs_save_content_data', 'save_always_as_draft', 10, 3 );
function save_always_as_draft( $post_data, $_post, $post_id ) {
// Por algum motivo, sempre queremos que o post seja um rascunho.
$post_data['post_status'] = 'draft';
return $post_data;
}
A partir da versão 4.0, agora você pode alternar entre as visualizações de desktop, tablet e celular enquanto edita! Chamamos isso de modo responsivo. No modo responsivo, seu site será redimensionado para um tamanho menor a fim de simular como ele ficaria em telas menores.
Ao visualizar seu site nas exibições de tablet ou celular, você terá recursos de edição limitados. Com isso, você pode APENAS fazer o seguinte:
* O PBS aplica algumas estilizações responsivas aos seus elementos e linhas, portanto algumas margens não poderão ser ajustadas.
Aqui estão algumas coisas que você não pode fazer:
Se você estiver visualizando seu site nas exibições de tablet ou celular, quaisquer ajustes de margem que fizer serão aplicados apenas à visualização atual e à visualização menor. Isso permite ajustar seus designs para que fiquem melhores em telas menores, separadamente da versão completa para desktop.
Aqui está um exemplo para deixar as coisas mais claras.
Isso se aplica apenas a ajustes de margens; alterações de texto ou de estilo de texto são aplicadas em todos os tamanhos de tela.
Ao visualizar nas exibições de tablet ou celular, suas linhas terão um novo botão de barra de ferramentas de “olho” que aparecerá ao passar o cursor sobre elas. Clicar nele permitirá mostrar/ocultar a linha para o tamanho de tela atual.
As linhas ocultas ficarão um pouco transparentes durante a edição para indicar que ficarão ocultas quando você terminar de editar.
Observe que este recurso está disponível apenas para linhas.
Se você é um desenvolvedor de temas, incluir o PBS no seu tema pode aumentar significativamente o valor do seu produto.
Entre em contato conosco pelo e-mail [email protected], vamos colaborar!
O CloudFlare é uma CDN DNS gratuita amplamente utilizada. É excelente, mas o PBS atualmente apresenta problemas quando se trata do recurso Rocket Loader. O Rocket Loader melhora o tempo de carregamento de arquivos Javascript, mas bagunça a ordem de dependência e chamada dos scripts do PBS. Se você estiver com o Rocket Loader ativado, o botão de edição do Page Builder Sandwich não aparecerá (e nenhum erro será exibido no console Javascript).
Para desativar o Rocket Loader, faça login na sua conta do CloudFlare e acesse as configurações do seu domínio. Navegue até as configurações de Velocidade (Speed):
Em seguida, role para baixo até as configurações do Rocket Loader e certifique-se de que a opção esteja desativada (off):
Depois de desativar isso, certifique-se de limpar todo o cache do seu site nas configurações de Cache (Cache settings):
Após limpar todo o cache, você pode atualizar a página e o botão de edição do Page Builder Sandwich deverá aparecer agora.
Chamado logo antes de o conteúdo ser salvo. Isso é chamado quando um salvamento foi iniciado a partir do editor do PBS.
Nenhum
Um filtro para modificar o conteúdo do post a ser salvo. Isso é chamado quando um salvamento foi iniciado a partir do editor do PBS.
$content
String. O conteúdo final do post a ser salvo.
$post_id
Int. O ID do post que estamos salvando.
Ao usar o Varnish Cache, se após salvar suas alterações você ainda conseguir ver seu conteúdo antigo, é possível que o Varnish Cache não tenha sido limpo automaticamente.
Existem alguns plugins do WordPress que permitem limpar seu cache: https://wordpress.org/plugins/search/varnish+cache/
Se isso não funcionar, você também pode limpar manualmente o Varnish Cache executando este comando em um terminal:
curl -X PURGE http://mysite.com/my-page/
Markdown é basicamente uma sintaxe que você digita durante a edição para adicionar ou alterar a formatação do seu texto. Elas funcionam como teclas de atalho, mas em vez de pressionar a combinação, você as digita.
Abaixo está uma lista de todas as sintaxes Markdown suportadas no Page Builder Sandwich.
(Atenção aos espaços)
# Título1
## Título2
até:
###### Título6
> Citação em bloco
(4 espaços)Texto pré-formatado/Código
* Lista com marcadores - Lista com marcadores
1. Lista numerada 1) Lista numerada
- ------------------------------(ou vários traços)
Digitar URLs as converterá automaticamente em um link:
Acesse https://pagebuildersandwich.com
Digite “lorem” e pressione Tab para criar conteúdo de texto fictício.
Para desativar o PBS, primeiro faça login no seu Painel / backend e, em seguida, navegue até Plugins > Plugins instalados:
Quando estiver na página de Plugins, role para baixo na sua lista de plugins e encontre o do Page Builder Sandwich. Logo abaixo do nome, você deverá ver um link desativar junto com outros links, como Editar ou Alterar licença (isso pode variar no seu site). Clique no link desativar para desativar o plugin.
Se você salvou as alterações na sua página e…
isso pode significar que salvar não acionou a limpeza dos dados armazenados pela sua solução de cache.
Se você estiver usando algum tipo de solução de cache – como um plugin de cache como o W3 Total Cache, um software de cache do lado do servidor como Memcached ou Redis, ou cache de DNS como o CloudFlare – ela pode não ter limpado o seu conteúdo salvo.
Uma forma de verificar se esse é o caso é editar sua página no painel de administração/backend (da maneira normal) e depois visualizar sua página no frontend. Se o seu conteúdo não mudou, talvez o cache não tenha sido limpo automaticamente.
Algumas soluções de cache que não são do WordPress possuem um plugin complementar para WordPress que pode ajudar a purgar ou limpar o cache atual; soluções nativas do WordPress geralmente têm botões ou opções para isso.
Também é possível que algum tipo de erro de PHP tenha ocorrido durante o salvamento.
Para verificar se isso está acontecendo, abra o console de desenvolvedor (de preferência no Chrome) e navegue até a aba Rede (Network). Uma vez lá, salve suas alterações no PBS e você deverá ver várias entradas para admin-ajax.php. Se você vir isso em vermelho, isso indica que ocorreu um erro. Verifique se você vê algo parecido com isto:
Se este for o caso, por favor envie-nos um e-mail para [email protected] junto com as credenciais de login necessárias para que possamos verificar e corrigir isso para você.
Leia o artigo sobre a compatibilidade com o Wordfence aqui: http://docs.pagebuildersandwich.com/article/214-wordfence-firewall-setup-compatibility
Na maioria dos elementos (exceto shortcodes, no entanto), você pode especificar uma animação de entrada que é reproduzida quando o elemento se torna visível na sua tela.
Para fazer isso, passe o cursor sobre um elemento para fazer a barra de ferramentas aparecer e, em seguida, clique no botão de engrenagem.
Isso deve abrir o inspetor. Navegue até a área Animations, abra-a e escolha uma animação.
Depois de escolher uma animação, ela deve ser reproduzida para mostrar uma prévia. Você pode refinar ainda mais a animação com as outras opções fornecidas.
As animações só são reproduzidas quando o usuário rola a página e o elemento entra em exibição. Se o elemento já estiver visível quando você chegar à sua página, ele não será animado.
Não, você não vai! Todas as suas páginas e conteúdo ainda devem permanecer no seu site. Isso significa que você pode desativar o PBS com segurança ao atualizar da versão gratuita para a versão premium, ou quando estiver apenas testando as coisas.
No entanto, nem tudo terá a mesma aparência. Você notará que alguns itens na sua página mudarão porque o PBS contém estilos e scripts adicionais necessários para alguns dos elementos mais elaborados.
Aqui estão algumas coisas que permanecerão quando você desativar o PBS:
Aqui estão algumas coisas que irão desaparecer quando você desativar o PBS:
Nota: Isso não se aplica a clientes da Envato
Se você estiver enfrentando erros ao ativar sua licença, aqui estão algumas coisas para tentar..
Isso acontece principalmente com pessoas que atualizam para uma versão mais recente. Se você atualizou diretamente os arquivos do plugin de forma manual e pulou as etapas de atualização ou desativação-ativação, alguns processos podem não ter sido executados corretamente. Por favor, desative o plugin, depois o reative e tente inserir sua licença novamente.
A partir da v3.2, o Page Builder Sandwich foi integrado ao Freemius. Houve casos em que a limpeza dos dados do Freemius corrigiu erros de ativação de licença. Veja como resolver isso.
Acesse seu painel e mude sua URL para http://yoursite.com/wp-admin/admin.php?page=freemius (não se esqueça de alterar a URL para corresponder ao seu site.) Se você chegar a este local abaixo, então está no lugar certo.
Clique no botão Delete All Accounts e depois clique também no botão Clear API Cache. Depois de fazer isso, tente inserir sua chave de licença novamente.
Se não funcionar, entre em contato conosco em [email protected] e forneça detalhes sobre o problema e sobre o seu site.
Aqui adicionei uma linha com uma cor de fundo e, em seguida, adicionei uma imagem dentro dela. Aqui está:
Para fazê-la “sobressair” acima do contêiner, passe o mouse sobre o elemento que você deseja mover. Em seguida, quando os contornos aparecerem, mova o mouse para além da parte superior do contorno. Ele deverá mostrar o valor atual da margem superior:
Clique e arraste a margem superior para cima para diminuir a sua margem, tornando-a um valor negativo:
Agora a imagem “sobressai” para fora da linha!
Se o elemento estiver sendo cortado ao ultrapassar a linha, abra o inspetor de propriedades da linha e desative a opção overflow hidden nas opções Avançadas:
Para adicionar algum texto fictício rapidamente, digite a palavra “lorem” e pressione Tab ou Enter para adicionar rapidamente um texto de preenchimento lorem ipsum :
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At dolor sed numquam? Sapiente autem adipisci, minus expedita enim, suscipit laboriosam deleniti possimus sequi pariatur explicabo numquam alias atque officia sit.
O Page Builder Sandwich funciona com todos os plugins de cache. No entanto, você pode encontrar alguns problemas se ativar a funcionalidade de minificação ou cache deles.
Apenas certifique-se de que a minificação esteja desativada para usuários conectados e tudo deve funcionar perfeitamente.
Estamos mostrando apenas as configurações do W3 Total Cache aqui, mas outros plugins de cache e minificação também devem ter configurações semelhantes.
Certifique-se de que Don’t cache pages for logged in users esteja marcado em Performance > Page Cache
Se estiver usando a minificação, certifique-se de que Disable minify for logged in users esteja marcado em Performance > Minify
Se você estiver tentando arrastar as alças de margem ou padding superior e inferior e as margens/paddings do elemento não estiverem mudando, pode haver outros estilos que estejam sobrescrevendo forçadamente qualquer alteração de estilo. Isso também pode acontecer quando você não consegue alterar planos de fundo, bordas ou quando imagens transparentes sempre recebem uma cor de fundo.
Para encontrar o problema, abra o inspetor do seu navegador e inspecione o elemento. Navegue pelos estilos desse elemento. Se você vir algo parecido com isto:
Então você pode ter certeza de que o seu tema ou um plugin está impedindo que quaisquer outros estilos sejam aplicados ao elemento. Passe o mouse sobre a folha de estilos para descobrir de qual tema/plugin ela está vindo.
Para corrigir isso, remova a parte “! important” do estilo, e você deverá conseguir aplicar estilos novamente. Pode ser necessário entrar em contato com o autor do tema ou plugin para corrigir isso.
Para incorporar conteúdo de sites externos, basta colar a URL e pressionar Enter. Por exemplo, você pode copiar e colar esta URL do YouTube:
https://www.youtube.com/watch?v=dQw4w9WgXcQ
A incorporação via iframe também é possível colando códigos de incorporação <iframe>. Por exemplo, copie e cole este código de incorporação:
<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0″ frameborder=”0″ allowfullscreen></iframe>
Você pode incorporar URLs de sites listados no WordPress Codex: https://codex.wordpress.org/Embeds e de qualquer site com oEmbed ativado.
O Page Builder Sandwich verifica regularmente se você ainda está conectado ao WordPress. Isso é feito para garantir que suas alterações sejam de fato salvas quando você clicar no botão salvar. Isso também é usado para bloqueio de posts e salvamentos automáticos.
Dependemos da API Heartbeat do WordPress para realizar nossas verificações e ela, por sua vez, depende de cookies e sessões do navegador. Portanto, se você continuar recebendo esses pop-ups de “sessão expirada” durante a edição, pode haver algo impedindo o WordPress de rastrear você adequadamente. Aqui estão algumas coisas que você pode fazer para resolver isso:
Se você tiver plugins de cache instalados, ou cache de DNS, ou qualquer forma de cache, limpe-os. Limpe também o cache do seu navegador. É possível que você não esteja recebendo os scripts mais recentes do seu site.
Também é possível que seus cookies tenham sido corrompidos; isso pode ser facilmente resolvido limpando os cookies do seu navegador nas configurações dele. Geralmente fica perto da opção onde você limpa o cache do navegador.
Vá para Configurações > Geral e verifique suas configurações. Procure as configurações de Endereço do WordPress (URL) e Endereço do site (URL). Os domínios e protocolos deles devem corresponder ao seu domínio real. Por exemplo, se um tiver “http://”, mas você acessar seu site usando “https://”, as configurações devem estar como “https://”. Outro problema comum seria um desses URLs ter um “www” e o outro não.
Estes devem coincidir:
ou:
Para corrigir isso, você pode alterar as configurações em Configurações > Geral. Se você não conseguir editar essas configurações, poderá abrir seu FTP e editar o arquivo wp-config.php, adicionando as seguintes linhas:
define( 'WP_HOME', 'http://example.com' ); define( 'WP_SITEURL', 'http://example.com' );
Nota: Por padrão, o cabeçalho é removido apenas da página inicial.
Para remover o cabeçalho ou menu de qualquer uma das suas páginas, você precisará de um plugin que permita adicionar CSS personalizado, como o Jetpack.
Para remover o cabeçalho, você precisará do ID do post da sua publicação e, em seguida, adicionar este CSS personalizado (substitua o 9999 aqui pelo ID do seu post):
body.page-id-9999 #masthead {
display: none;
}
Para remover os menus de uma página (substitua o 9999 aqui pelo ID do seu post):
body.page-id-9999 #header-wrapper {
display: none;
}
ou ao remover o menu apenas da sua página inicial:
body.page-id-9999 #header-wrapper {
display: none;
}
Você pode adicionar imagens de fundo às suas linhas e planos de fundo. Além disso, você também pode tingir sua imagem de fundo com uma cor para que ela se adapte melhor ao seu design.
Por exemplo, tenho aqui uma linha com uma imagem de fundo com um texto sobreposto em branco. Está bem difícil ver o texto agora por causa da imagem de fundo que escolhi.
Para deixar tudo melhor, podemos adicionar um pouco de cor à nossa imagem de fundo. Para fazer isso, passe o mouse sobre a linha e clique no ícone de engrenagem da linha para abrir suas propriedades. Vá para as opções de Background e ative Background Image Tint.
Depois de ativado, você altera a cor de fundo e agora uma tonalidade colorida será adicionada à sua imagem de fundo. Você também pode alterar a intensidade ou a opacidade da tonalidade. Aqui está o meu fundo tingido de verde para tornar o texto mais visível:
| Versão Lite | Não disponível |
| Versão Premium | Todos os recursos disponíveis
|
Carrosséis são uma maneira inovadora de adicionar conteúdo que se repete continuamente em exibição. O Page Builder Sandwich possui um elemento de carrossel nativo que pode ser usado, eliminando a necessidade de plugins de carrossel externos.
Clicar no botão de engrenagem do elemento de carrossel permite configurar o comportamento do carrossel, como animação do slide, atraso e muito mais. Ao criá-lo, você recebe três slides de carrossel para trabalhar, com a opção de adicionar ou excluir slides. Todos esses slides aceitam os elementos comumente usados, como texto, imagens e determinados shortcodes.
Alternar entre os slides é tão fácil quanto selecionar os próprios botões de navegação. A ordem dos slides também pode ser modificada por meio das propriedades (ícone de engrenagem).
Para alterar o status do seu post, passe o mouse sobre o indicador suspenso no botão de salvar no canto superior esquerdo da tela. Isso exibirá mais opções de salvamento.
Se você estiver usando a versão lite, talvez tenha notado as bandeiras triangulares amarelas. Elas indicam se determinado botão/elemento/opção é um recurso premium.
Se você quiser ocultá-las, pode ir até o seu Painel, navegar até a página de configurações em PBSandwich > Settings e marcar a opção Hide Premium Feature Flags
| Versão Lite | Todos os recursos disponíveis |
| Versão Premium | Todos os recursos disponíveis |
Clique no elemento HTML no Inspetor para adicionar um novo elemento HTML, uma janela modal deve aparecer. Digite ou cole seu código HTML lá e clique em salvar HTML. Seu HTML deve agora aparecer dentro do editor.
Passe o mouse sobre o elemento HTML para exibir a barra de ferramentas. Você pode editar seu HTML clicando no ícone de lápis na barra de ferramentas ou clicando duas vezes no próprio elemento.
Não queremos uma interface desordenada e queríamos que tudo fosse intuitivo e fácil de descobrir. Portanto, embora a interface de usuário do Page Builder Sandwich pareça simples, ela é bastante poderosa e você pode fazer muitas coisas durante a edição.
Você também pode fazer muitas coisas legais usando o cursor do mouse. Sobreposições interativas e barras de ferramentas aparecem quando você passa o mouse sobre diferentes elementos. Cada uma delas faz coisas diferentes, tais como:
Assim que começar a editar com o PBS, passe o mouse sobre o título da sua página/post; um contorno deverá aparecer sobre ele. Clique no título para posicionar o cursor nele e modificá-lo.
As ferramentas de formatação não estão disponíveis na área do título; você não pode modificar seus estilos nem adicionar elementos ao título.
Linhas e colunas são ferramentas que você pode usar para criar conteúdo dividido em seções.
Ao editar usando o Page Builder Sandwich a partir de uma página/postagem recém-criada, o conteúdo que você digitar será todo colocado em uma única coluna. Isso é ótimo para escrever posts de blog, mas se você quiser layouts especiais para landing pages ou páginas de contato, provavelmente desejará um layout de 2 colunas ou até mesmo uma combinação de diferentes colunas ao longo da sua página.
Você pode adicionar linhas e colunas usando estes botões no inspetor:
Uma vez adicionada, sua nova linha ficará contornada:
Você pode colocar qualquer coisa dentro de suas linhas e colunas: texto, shortcodes, widgets e até mesmo adicionar mais linhas e colunas.
Quando uma linha (ou um conteúdo dentro da sua linha) for selecionada, mais opções ficarão disponíveis no seu inspetor. Você pode usar estes botões para estilizar ainda mais a sua seção:
Há também opções adicionais para estilizar suas colunas logo abaixo disto no inspetor.
Você pode mover as linhas para locais diferentes clicando e segurando na própria linha (se você clicar e segurar em um elemento dentro dela, o elemento será arrastado e não a linha).
Se você não conseguir ver o botão “Editar com o Page Builder Sandwich” no frontend do seu site, aqui estão algumas coisas que você pode tentar:
O botão de edição do PB Sandwich está disponível na barra de administração no seu frontend. Certifique-se de que a barra de administração esteja visível acessando seu painel administrativo e navegando até Usuários > Seu perfil e verificando se a opção Mostrar barra de ferramentas ao ver o site está marcada.
Apenas Posts, Páginas e Tipos de Post Personalizados são editáveis no Frontend. Você só pode editar itens no frontend se puder editá-los usando o editor de conteúdo do WordPress no backend. As outras áreas do seu site — por exemplo, a lista de posts do blog na página inicial, lista de todos os posts do blog, listagens de categorias, páginas 404, páginas de busca — são páginas dinâmicas criadas pelo WordPress em conjunto com o tema que você está usando e não podem ser editadas com o PB Sandwich.
Um indicativo de que a página da web atual é editável é se você consegue ver “Editar post” ou “Editar página” na sua barra de administração.
Se a sua página/post for gerada dinamicamente por um tema ou plugin, ela não será editável com o Page Builder Sandwich (e muito provavelmente em outros construtores de páginas também). Se você notar que o seu editor de conteúdo no backend está vazio, mas ao visualizar a página no frontend ela está cheia de conteúdo, esse é um bom indicativo de que sua página é gerada dinamicamente.
Para verificar se sua página é gerada dinamicamente, veja o código-fonte da página da web (clique com o botão direito e escolha “Exibir código-fonte da página”). Pesquise pelo texto “pbs-main-wrapper”; se você não encontrar esse texto em lugar nenhum, sua página é gerada dinamicamente.
Aqui estão alguns exemplos de conteúdo gerado dinamicamente:
Houve casos em que o tema não exibia o conteúdo de forma alguma se ele estivesse em branco, e isso fazia o PBS pensar erroneamente que a página não era editável. Para verificar se esse é o caso, edite sua página/post no editor do backend, tente adicionar qualquer texto ao seu conteúdo (por exemplo, “olá”) e, em seguida, clique no botão “Editar com o Page Builder Sandwich” a partir de lá.
Obrigado a Mathias Hellquist por esta dica!
Alguns construtores de páginas fazem você escolher entre usar o editor de conteúdo padrão do WordPress ou o editor próprio do construtor de páginas. Se você já editou sua página usando outro construtor de páginas, é possível que esse construtor de páginas já tenha “reivindicado” o conteúdo, e outros hooks/filtros de conteúdo não consigam mais ser executados. Por causa disso, às vezes o Page Builder Sandwich não conseguirá detectar onde está o seu conteúdo e não mostrará o botão de edição porque não há nada para editar.
Para corrigir isso, basta optar por não usar esse construtor de páginas para essa página/post específico e optar por usar apenas o editor de conteúdo padrão do WordPress.
Certifique-se de ter permissões de edição na página
O botão de edição não aparecerá se você não puder editar a página. Por exemplo, se você é um editor ou colaborador e pode escrever posts de blog e artigos no site, isso não significa necessariamente que você pode editar a página inicial ou a página de contato. Se você consegue ver o botão “Editar post” na sua barra de administração, você também deve ser capaz de editá-la usando o PB Sandwich. Peça privilégios de edição ao administrador do seu site se precisar deles.
O PB Sandwich utiliza Javascript extensivamente. Se houver erros de Javascript provenientes de outros scripts em seu site, isso pode impedir o funcionamento do PB Sandwich. Para verificar se esse é o caso, você pode abrir o console de desenvolvedor no seu navegador para verificar a existência de erros.
Eu recomendaria usar o Chrome para isso. Clique com o botão direito em qualquer elemento da página e, em seguida, clique na opção “Inspecionar”. Isso abrirá uma nova área na parte inferior do seu navegador; clique na aba “console”. Se houver erros, você deverá ver algo como isto:
Se você tiver um erro, também poderá obter uma pista de onde ele está vindo ao clicar ou passar o mouse sobre o nome do script:
Esses erros podem vir do seu tema ou de outros plugins que você possa ter. A correção desses erros pode fazer o PB Sandwich voltar a funcionar.
Se o seu tema ou um dos seus plugins estiver causando o erro de Javascript, por favor, avise-nos por e-mail em [email protected] e faremos o nosso melhor para corrigir o problema 🙂
A CloudFlare é uma CDN/DNS gratuita amplamente utilizada. Ela é excelente, mas o PBS atualmente apresenta problemas em relação ao recurso Rocket Loader. O Rocket Loader melhora o tempo de carregamento de arquivos Javascript, mas prejudica a ordem de dependências e de chamadas dos scripts do PBS. Se você estiver com o Rocket Loader ativado, o botão de edição do Page Builder Sandwich não aparecerá (e nenhum erro de Javascript será exibido no console).
Para verificar se o seu site está usando o Rocket Loader da CloudFlare, veja o código-fonte da sua página (clique com o botão direito e escolha “Exibir código-fonte da página”) e, em seguida, pesquise pelo texto “rocketscript”; se encontrar esse texto, significa que você está com o Rocket Loader ativado.
Leia o artigo sobre a Compatibilidade com CloudFlare e Rocket Loader para instruções completas sobre como desativá-lo.
Certo, a este ponto, se nenhuma das soluções acima funcionar, talvez seja hora de explicar o porquê de não estar aparecendo e o que fazer a respeito. Pronto? Vamos lá!
O Page Builder Sandwich precisa saber onde o conteúdo da sua página/post está localizado. Fazemos isso monitorando quando o WordPress carrega o conteúdo do post e “marcando” essa área, para que, quando tudo for carregado, possamos encontrar onde estão os dados corretos.
Às vezes, alguns plugins substituem ou ignoram esse processo e, em vez disso, tentam carregar o conteúdo à sua própria maneira. Às vezes isso não causa problemas, mas em determinados cenários, especialmente quando se trata do carregamento do conteúdo principal do post, isso pode fazer com que alguns plugins parem de funcionar. Quando outro plugin ignora esse processo de carregamento, as “marcações” que fizemos podem ser perdidas e, quando chega o momento de o editor entrar em ação, ele não consegue mais encontrar onde está o seu conteúdo. Portanto, o botão de edição não aparece! Você também pode notar que alguns plugins que adicionam conteúdo à sua página, como certos plugins de compartilhamento em redes sociais, também podem parar de funcionar exatamente pelo mesmo motivo.
O Page Builder Sandwich precisa saber onde o conteúdo da sua página/post está localizado, e faz isso conectando-se ao filtro the_content e adicionando um wrapper em torno do seu conteúdo principal. Alguns plugins podem substituir isso e, em vez disso, sobrescrever o conteúdo com uma função get_the_content() mais adiante no fluxo. Infelizmente, fazer isso impede que TODOS os filtros the_content sejam chamados e, portanto, o wrapper do PBS é perdido. As alterações de qualquer outro plugin também seriam perdidas.
Não há nada de errado em usar get_the_content() por si só, mas pode haver efeitos adversos se isso for usado na consulta principal e dentro da página de modelo de post único em vez da chamada normal de the_content(), onde todos os filtros the_content são executados.
Você pode verificar se as “marcações” do Page Builder Sandwich não estão presentes acessando sua página/post no frontend e visualizando o código-fonte da página enquanto estiver conectado. Procure no emaranhado de código se consegue encontrar a string:
data-name="main-content"
Se você conseguir encontrá-la, pode ser apenas um problema de Javascript em algum lugar; basta nos informar o tema e os plugins que você está usando para que possamos corrigir isso.
Mas se você não conseguir encontrá-la, pode ser apenas que o seu tema (ou um plugin, mas é mais provável que seja o tema se for uma página ou post de blog) esteja fazendo algo com o conteúdo do post. Se for esse o caso, você deve entrar em contato com o autor do tema e informá-lo sobre o problema! Você também pode mostrar a ele a explicação técnica do “porquê” acima, pois isso pode ajudar na depuração 🙂
Se você se sente seguro para fazer alterações no PHP, pode tentar corrigir o problema localizando o arquivo de modelo que gerencia o conteúdo do post. Uma solução que encontramos é substituir as chamadas para:
$content = get_the_content();
por:
ob_start(); the_content(); $content = ob_get_clean();<br>
Observação: A variável PHP pode variar no seu caso, mas o conceito deve ser o mesmo. Se funcionar, seria melhor também criar um tema filho em vez de implementar essa alteração diretamente no seu tema. Também pode haver efeitos colaterais por conta da alteração, portanto, é melhor consultar o autor do seu tema sobre isso.
| Versão Lite | Não disponível |
| Versão Premium | Todos os recursos disponíveis
|
Opcionalmente, destaque algum texto e clique no elemento de botão no inspetor. Isso deve abrir uma janela modal onde você pode digitar a URL de destino do seu botão. Você também pode pesquisar qualquer página existente em seu site a partir dali.
Ao contrário de outros elementos, os botões são inseridos em linha (inline), o que significa que serão posicionados ao lado de outros textos (ou outros botões). Você não pode arrastar e soltar botões individuais para outros locais; em vez disso, arraste o botão juntamente com o texto ao redor dele.
Durante a edição, ao clicar em um botão, você poderá ver opções adicionais de estilo no inspetor. Você também pode passar o mouse sobre os botões para ver a URL vinculada a eles e outros comandos.
Nota: Faça isso quando você já tiver o PBS instalado e ativado, e quiser atualizá-lo com um arquivo zip que baixou do site ou de um anexo enviado por nós por e-mail.
Nota: Estamos usando outro plugin para realizar atualizações, o que nos permite atualizar o PBS imediatamente sem a necessidade de desinstalá-lo primeiro.
Vá em Plugins > Adicionar novo e, na caixa de pesquisa, busque pelo plugin “Easy Theme and Plugin Upgrades”
Assim que encontrar o plugin, instale-o e ative-o.
Depois de ativar o plugin Easy Theme and Plugin Upgrades, vá novamente em Plugins > Adicionar novo e clique no botão Enviar plugin próximo ao topo:
Escolha e instale o arquivo zip do Page Builder Sandwich,
Pronto. Agora você deve ter a nova versão do PBS.
| Versão Lite | Disponível com estilização limitada |
| Versão Premium | Todos os recursos disponíveis
|
Clique no elemento de mapa para adicionar um mapa à sua página. Sempre que o elemento de mapa for selecionado, o inspetor deverá exibir as configurações do mapa. Você pode inserir coordenadas de latitude & longitude ou um endereço no campo de localização no inspetor para centralizar seu mapa nessa área. Também existem outras opções de estilo disponíveis por lá.
Você pode manipular ainda mais o elemento de mapa movimentando ou aumentando/diminuindo o zoom. Observe que as suas alterações no mapa serão aplicadas ao elemento.
Para usuários premium, você pode estilizar seu mapa escolhendo uma cor para tonalizá-lo; outra opção é usar o snazzymaps.com para gerar alguns esquemas de cores e depois utilizá-los. O SnazzyMaps pode ser usado para criar esquemas de cores semelhantes a este: https://snazzymaps.com/style/20053/papuportal-dark Para usar esses esquemas de cores, copie o Javascript style array para o inspetor.
A altura do mapa pode ser ajustada, no entanto a largura do mapa não pode e sempre será redimensionada para a largura máxima disponível. Para redimensioná-la, coloque seus mapas dentro de linhas e colunas. Você também pode definir os mapas para ocupar a largura total do navegador.
Você pode usar o seu mouse para posicionar rapidamente o cursor em diferentes áreas do seu conteúdo ou selecionar elementos diferentes.
Você também pode usar as teclas de seta do seu teclado para mover o cursor pelo conteúdo. Você pode usar isso para ir acima ou abaixo das linhas.
Ao lidar com linhas e colunas, você pode clicar nas bordas das linhas para adicionar conteúdo logo após ou antes da sua linha. Isso é especialmente útil se você tiver várias linhas umas dentro das outras e quiser adicionar algum conteúdo entre elas.
O Page Builder Sandwich não é como o seu construtor de páginas típico; ele é descomplicado e simples de usar.
Você pode assistir ao vídeo abaixo para um tour rápido.
Primeiro, crie uma nova página, post ou CPT. Em seguida, visite o seu novo post ou qualquer um existente no frontend. O PBS é 100% frontend, você não precisará mexer no backend.
Deve haver um botão “Page Builder Sandwich” no topo da sua página (na sua barra de administração), clique nele para começar a editar. Você verá a área de formatação de texto surgir no topo e o painel para adicionar elementos surgir na lateral. A área de conteúdo do seu tema agora é o seu editor!
Você só pode editar páginas individuais com o PBS. Não é possível editar uma lista de posts de blog ou uma página 404, já que essas são criadas pelo seu tema. Posts, páginas e tipos de post personalizados funcionam perfeitamente.
Agora vem a parte incrível… quando estiver no frontend e dentro do editor, clique em qualquer texto no seu conteúdo ou clique dentro da sua área de conteúdo e comece a digitar! Ao contrário de outros construtores de páginas, o PBS permite que você edite o conteúdo diretamente, sem a necessidade de passar por caixas de diálogo pop-up.
Durante a edição, a área no topo é chamada de Barra de Formatação de Texto. Essa barra contém todas as ferramentas de formatação que você usará para estilizar o texto, como: cores, negrito, itálico, alinhamentos, adição de links, marcadores e muito mais. Passe o mouse sobre cada botão para descobrir o que a ferramenta faz.
Passe o mouse sobre o botão Adicionar Elementos no canto superior esquerdo da tela para exibir o Painel Adicionar Elemento. Você também pode apenas mover o mouse para o lado esquerdo da tela para fazê-lo aparecer.
Para inserir qualquer elemento, segure o clique do mouse sobre um deles e arraste-o para a sua área de conteúdo. A área onde o elemento será posicionado ficará destacada. Solte o botão do mouse para posicionar o elemento.
Passe o mouse sobre qualquer elemento que você tenha no seu conteúdo e, então, contornos e barras de ferramentas deverão aparecer sobre eles.
Você pode passar o mouse sobre as bordas dos contornos para aumentar/diminuir as margens entre os elementos.
Você também pode clicar em um botão na barra de ferramentas para executar ações rápidas no elemento. Clicar no ícone de engrenagem na barra de ferramentas abrirá o Inspetor de Propriedades, que contém mais opções.
O inspetor de propriedades oferece mais controle sobre a aparência dos seus elementos. Você pode adicionar muitas coisas como sombras, animações, alterar cores de mapas, raio de borda e muito mais.
Você também pode acessar as propriedades dos elementos-pai. Por exemplo, se você colocou uma imagem dentro de uma coluna e abriu o inspetor de propriedades, você poderá acessar as propriedades da imagem, da coluna em que ela está contida e da linha na qual a coluna está contida.
O inspetor de propriedades contém muitas configurações diferentes para diferentes elementos, então não deixe de conferir todas elas.
O Page Builder Sandwich mostra os shortcodes reais no frontend, e você também pode editá-los facilmente!
Se você memorizou seus shortcodes, pode inseri-los digitando diretamente no seu conteúdo. Mas se você não decorou todos (quem faz isso?), o inspetor lista todos os shortcodes disponíveis no seu site. Arraste um botão de Shortcode do inspetor para a sua área de conteúdo, encontre o que deseja inserir e clique nele para inseri-lo.
Os shortcodes são renderizados em conteúdo real no frontend; para editá-los, você pode selecioná-los e verificar seus atributos no inspetor. Ou, para obter mais controle, você pode dar um clique duplo no shortcode para editá-lo em formato bruto. Depois de realizar suas edições, o shortcode será atualizado para refletir as alterações.
Você pode clicar, arrastar qualquer coisa e movê-la para qualquer lugar com o PBS. Ao arrastar algo, mova-o para cima de outro elemento na página; você pode movê-los tanto para cima quanto para baixo de qualquer outro conteúdo.
Salvando seu trabalho
Quando estiver satisfeito com o seu design, basta clicar no botão salvar no canto superior esquerdo da sua página. Só isso!
O Page Builder Sandwich não é como o seu construtor de páginas típico; ele é descomplicado e simples de usar.
Você pode assistir ao vídeo abaixo para um tour rápido.
Primeiro, crie uma nova página, post ou CPT. Em seguida, acesse seu novo post ou qualquer um já existente no frontend. O PBS é 100% frontend; você não precisará ficar mexendo no backend.
Deve haver um botão “Page Builder Sandwich” no topo da sua página (na sua barra de administração); clique nele para começar a editar. Você verá a área de formatação de texto surgir no topo e o painel de adição de elementos surgir na lateral. A área de conteúdo do seu tema agora é o seu editor!
Você só pode editar páginas individuais com o PBS. Não é possível editar uma lista de posts do blog ou uma página 404, pois elas são criadas pelo seu tema. Posts, páginas e tipos de post personalizados funcionam perfeitamente.
Agora vem a melhor parte… assim que você estiver no frontend e dentro do editor, clique em qualquer texto no seu conteúdo ou clique dentro da sua área de conteúdo e comece a digitar! Ao contrário de outros construtores de páginas, o PBS permite editar o conteúdo diretamente, sem a necessidade de passar por caixas de diálogo pop-up.
Durante a edição, a área no topo é chamada de Barra de Formatação de Texto. Essa barra contém todas as ferramentas de formatação que você usará para estilizar o texto, como: cores, negrito, itálico, alinhamentos, inserção de links, marcadores e muito mais. Passe o mouse sobre cada botão para descobrir o que a ferramenta faz.
Passe o mouse sobre o botão Adicionar Elementos no canto superior esquerdo da tela para exibir o Painel Adicionar Elementos. Você também pode apenas mover o mouse para o lado esquerdo da tela para fazê-lo aparecer.
Para inserir qualquer elemento, segure o clique do mouse sobre ele e arraste-o para a sua área de conteúdo. A área onde o elemento será colocado ficará destacada. Solte o botão do mouse para posicionar o elemento.
Passe o mouse sobre qualquer elemento presente em seu conteúdo para que contornos e barras de ferramentas apareçam sobre eles.
Você pode passar o mouse sobre as bordas dos contornos para aumentar/diminuir as margens entre os elementos.
Você também pode clicar em um botão na barra de ferramentas para executar ações rápidas no elemento. Clicar no ícone de engrenagem na barra de ferramentas abrirá o Inspetor de Propriedades, que contém mais opções.
O inspetor de propriedades oferece mais controle sobre a aparência dos seus elementos. Você pode adicionar muitas coisas, como sombras, animações, alterar cores de mapas, raio de borda e muito mais.
Você também pode acessar as propriedades dos elementos-pai. Por exemplo, se você inseriu uma imagem dentro de uma coluna e abriu o inspetor de propriedades, poderá acessar as propriedades da imagem, da coluna em que ela está contida e da linha na qual a coluna está inserida.
O inspetor de propriedades contém diversas configurações diferentes para diferentes elementos, por isso não deixe de explorar todas elas.
O Page Builder Sandwich mostra os shortcodes reais no frontend, e você também pode editá-los facilmente!
Se você decorou seus shortcodes, pode inseri-los digitando diretamente no seu conteúdo. Mas se você não decorou todos eles (quem faz isso?), o inspetor lista todos os shortcodes disponíveis no seu site. Arraste um botão de Shortcode do inspetor para a sua área de conteúdo, encontre o que deseja inserir e clique nele para aplicá-lo.
Os shortcodes são renderizados em conteúdo real no frontend; para editá-los, basta selecioná-los e conferir seus atributos no inspetor. Ou, para obter mais controle, você pode dar um clique duplo no shortcode para editá-lo em formato bruto. Depois de fazer suas edições, o shortcode será atualizado para refletir as alterações.
Você pode clicar, arrastar qualquer coisa e movê-la para qualquer lugar com o PBS. Ao arrastar algo, posicione-o sobre outro elemento na página; você pode movê-lo para cima ou para baixo de qualquer outro conteúdo.
Salvando seu trabalho
Quando estiver satisfeito com o seu design, basta clicar no botão de salvar no canto superior esquerdo da sua página. E pronto!
O plugin Lite e o plugin Premium são dois plugins diferentes. Para usar os recursos premium, você precisará desativar (ou desinstalar) a versão Lite, depois instalar e ativar o plugin Premium e, em seguida, inserir sua chave de licença.
Observação: Se você ativar os plugins Lite e Premium ao mesmo tempo, o plugin solicitará que você desative o que já possui antes de prosseguir.
Observação para clientes que compraram o PBS no pagebuildersandwich.com: Você também pode baixar o plugin pelo site; a chave de licença atual que você possui ainda deve funcionar. Se não funcionar, entre em contato conosco para emitirmos uma nova.
Após comprar o PBS, você deverá receber um e-mail contendo duas coisas:
Instale e ative o plugin premium, e então você verá esta tela:
Insira sua chave de licença aqui e clique em Agree & Activate License. Agora, os recursos premium deverão estar disponíveis.
Como alternativa, você também pode ir até a página de plugins e encontrar o plugin Page Builder Sandwich na lista:
Clique no link Activate License, e você poderá inserir sua licença por lá.
Você só pode editar páginas ou posts individuais usando o Page Builder Sandwich. Pense desta forma: se houver uma área “Novo Post” com um editor de conteúdo no painel de administração para isso, você poderá editá-lo com o Page Builder Sandwich.
Você deve conseguir editar o conteúdo de qualquer tipo de post personalizado.
Garantimos que o Page Builder Sandwich tenha um impacto quase nulo no desempenho do seu site. Quando desconectado, no mínimo, apenas os estilos CSS de linha e coluna são enfileirados, juntamente com os scripts JS e CSS necessários para os shortcodes que você usou.
Para os visitantes do seu site, no mínimo, apenas os estilos CSS de linha e coluna são enfileirados, juntamente com os scripts JS e CSS necessários para os shortcodes que você usou incluídos.
Recentemente, adicionamos algumas correções relacionadas ao problema de compatibilidade em que o Page Builder Sandwich e o plugin IMPress for IDX Broker eram ativados juntos. Isso causava uma falha no frontend para usuários conectados.
A correção tornou o PBS funcional novamente, mas tivemos que remover a capacidade do widget do IDX Broker de ser inserido dentro do editor. Apesar disso, o widget do IDX Broker ainda pode ser usado no menu Aparência > Widgets.
Para permitir que você trabalhe mais rápido, você pode usar vários atalhos de teclado disponíveis no Page Builder Sandwich.
Estes são atalhos para comandos que não são de formatação/ferramenta. Para teclas de atalho de formatação/ferramenta, passe o mouse sobre cada botão na barra de formatação de texto para ver a combinação de teclas de atalho correspondente.
| Tecla de Atalho | Descrição |
| CTRL+E (quando não estiver editando) | Iniciar edição |
| CTRL+SHIFT+R (durante a edição) | Atualizar página (já que CTRL+R é usado para alinhar à direita) |
| CTRL+S | Salvar alterações |
| CTRL+ESC | Descartar alterações e parar a edição |
| CTRL+C | Copiar |
| CTRL+V | Colar |
| CTRL+X | Recortar |
| CTRL+ENTER | Quebra de linha / próxima linha |
| CTRL+Z | Desfazer |
| CTRL+SHIFT+Z (Mac) CTRL+Y (PC) |
Refazer |