Como instalar ferramentas "ShareThis" no Webflow

Nota: Se tiver um plano de fluxo Web gratuito, ShareThis tools infelizmente não funcionará no seu sítio Web, uma vez que a funcionalidade de código personalizado está bloqueada. 

In order for ShareThis tools to work on your Webflow website, follow the steps below to add your unique ShareThis code to the <head> section of your website: 

Adicionar Partilhar Estas Ferramentas em Todas as Páginas

  1. Log in or sign up to the Partilhar Esta Plataforma.
  2. Add your domain.
  3. Copy your unique ShareThis installation script.
    • You can find it in Step 1 of any App page (e.g., Inline Share Buttons, Sticky Share Buttons, Follow Buttons).
    • Or, you can find the same script in Settings → Setup inside the Platform.
  4. Log in to Webflow’s website. On your Projects Dashboard, select the three dots icon from the project you want your buttons on, and click Settings.
  5. Dentro de Project Settings, vá para a secção Código Personalizado.
  6. Paste the unique ShareThis code that you copied from step 3 and click Publish.
  7. In the ShareThis Platform, open the app you want to use and click Enable App to activate it on your site.
  8. (Optional but recommended) Customize your app.
    • Choose between Smart Share Buttons or manual selection of networks.
    • Adjust colors to match your brand.
    • Set button size, shape, alignment, and enable share counts if desired.

Acrescentar Partilhar Estas ferramentas em páginas específicas

  1. Log in or sign up to the Partilhar Esta Plataforma.
  2. Add your domain.
  3. Copy your unique ShareThis installation script.
    • You can find it in Step 1 of any App page (e.g., Inline Share Buttons, Sticky Share Buttons, Follow Buttons).
    • Or, you can find the same script in Settings → Setup inside the Platform.
  4. Log in to your Webflow website. Open your website in design mode, select Pages from the left sidebar, then select Edit Page Settings from the specific page you want your buttons to be on.
  5. Dentro de Definições de Página, desça até à secção Código Personalizado.
  6. Cole o código único ShareThis que copiou do passo 4 e clique em Publish.
  7. In the ShareThis Platform, open the app you want to use and click Enable App to activate it on your site.
  8. (Optional but recommended) Customize your app.
    • Choose between Smart Share Buttons or manual selection of networks.
    • Adjust colors to match your brand.
    • Set button size, shape, alignment, and enable share counts if desired.

Acrescentar Partilha InlineEsta ferramenta

As ferramentas em linha requerem um fragmento extra de código para funcionar no seu site. Se quiser instalar os nossos Botões de Partilha Inline, Botões de Seguimento, Botões de Reacção, ou ferramentas de Alimentação Social no seu site, terá de adicionar código de colocação onde quiser que a ferramenta apareça.

  1. Na sua Plataforma ShareThis, seleccione a ferramenta ShareThis que pretende utilizar e copie o código de colocação. Dependendo da ferramenta que está a instalar, o código deve ser semelhante a esta:
  2. No modo de design do seu website de Webflow, vá para a Página onde pretende que os seus botões apareçam.
  3. Da barra lateral esquerda seleccione Adicionar e procure a opção Embedar, depois arraste-a para onde deseja que os botões apareçam.
  4. Na nova janela do HTML Embed Code Editor, cole o código único ShareThis que copiou do Passo 1.
  5. Clique em Guardar e Fechar.
  6. Clique em Publish.

Notas:

  • As ferramentas ShareThis podem não aparecer no backend do seu website, pelo que poderá ter de visitar o seu website publicado a fim de as visualizar.
  • O Webflow tende a incorporar os botões em recipientes Flex, o que poderia limitar a exibição de alguns conteúdos, especialmente o último botão.
    Uma forma de corrigir isto sem alterar a exibição do contentor principal de flex para inline-block é definir um valor fixo para a largura dos botões.

    Para o fazer, clique nos próprios botões e no Editor do Webflow, defina a sua Largura para um valor maior do que o que é neste momento (se isto só acontecer em ecrãs móveis, aplica o mesmo princípio, mas mude o ponto de quebra móvel no topo do Editor do Webflow para ecrãs/Tablets móveis):
O campo de largura dos botões está definido para 180 no Editor de fluxo Web, outros valores não são modificados.