Introduction to Knowband 1.0 Prestashop Accelerated Mobile Pages (AMP)
Mobile accelerated pages or AMP is a technology that provides convenient access to information on the Internet from the screens of smartphones and tablets. AMP is an advanced Google technology that reduces site load time. The goal of every ecommerce store owner should be to reduce the loading time of the website. Prestashop Accelerated Mobile Pages Module (AMP) .
O módulo Prestashop AMP permite que o administrador converta a home page, as páginas de categoria, as páginas de produtos e as páginas CMS em páginas AMP de carregamento rápido. Com a ajuda do Módulo Google Accelerated Mobile Pages, o administrador pode reduzir o tempo de carregamento do site. Além disso, com o AMP, o e-comerciante tem a capacidade de ativar / desativar seções (Best Sellers, produtos em destaque, nova chegada), você pode fornecer a incrível experiência do usuário. uma vez que seus clientes estão felizes, as vendas acontecerão facilmente.
Recursos do 1.1 do Módulo de Páginas Móveis Aceleradas Prestashop:
1. O módulo Prestashop Accelerated Mobile (AMP) permite que o administrador da loja converta a página da web em AMP.
2. Com a ajuda do módulo AMP da Prestashop, o administrador da loja pode converter a home page, as páginas de categoria, as páginas de produtos e as páginas CMS em AMP.
3. O addon Prestashop Accelerated Mobile (AMP) da Knowband fornece uma opção ao proprietário da loja para personalizar a home page, as páginas da categoria, as páginas do produto e as configurações das páginas CMS do back-office.
4. O administrador pode fazer o upload do logotipo da empresa no AMP e também pode corrigir a largura e a altura do site.
5. O Prestashop AMP Module oferece ao comerciante da loja uma opção para adicionar o CSS personalizado para adicionar a funcionalidade adicional.
6. O Módulo Google Accelerated Mobile Pages permite que o administrador da loja ative / desative a exibição da opção de best-sellers, produtos em destaque e novos produtos na página inicial. Além disso, eles podem selecionar o não. do produto mostrado em uma seção particular.
7. O dono da loja Prestashop pode mudar o banner dos melhores vendedores, destaque e novos produtos na página inicial.
8. O módulo Prestashop Accelerated Mobile Pages (AMP) forneceu as opções de compartilhamento de mídia social na AMP. Até mesmo o administrador pode adicionar mais ícones adicionando o script.
9. O administrador pode personalizar as categorias de AMP no back-end do módulo AMP Prestashop. Os clientes para procurar categorias na página AMP.
10. Ao usar o Módulo de Páginas para Dispositivos Móveis Acelerados do Google, o administrador pode gerar automaticamente um sitemap de AMP com a ajuda do CRON.
11. O administrador pode gerar o mapa do site AMP clicando no botão.
12. O addon Accelerated Mobile Pages da Knowband suporta o Google Analytics. O administrador do comércio eletrônico pode inserir o ID do cliente do Google Analytics para acompanhar o desempenho do AMP.
13. O Módulo Accelerated Mobile Pages da Google suporta vários idiomas.
14. Com a ajuda do Prestashop AMP Module, o administrador da loja Prestashop pode definir a cor
15. O módulo Prestashop AMP é fácil de usar e manusear.
Tecnologia para o desenvolvimento
Língua: PHP
Estrutura: PrestaShop
Etapas 2.0 para instalação do add-on de páginas móveis aceleradas Prestashop (AMP):
1.A estrutura de pastas do módulo AMP Prestashop.
2. Copie a pasta inteira nomeada como atualização do produto para a pasta de módulos do diretório raiz da sua loja PrestaShop através do FTP.
3. Você poderá encontrar o plug-in AMP do produto pronto para ser instalado nos Módulos da sua loja PrestaShop, conforme mostrado abaixo.
4. Clique no link Instalar para instalar o plugin.
Agora, seu plug-in Prestashop Accelerated Mobile Pages (AMP) está pronto para uso e clique em “configurar“link para configurar este módulo Prestashop por Knowband.
Interface administrativa 3.0
Depois de instalar o módulo de AMP (Google Accelerated Mobile Pages) na loja, o addon Prestashop fornecerá as seguintes interfaces:
1. Configurações Gerais 2. Configurações iniciais 3. Configurações da página de categoria 4. Configurações da página do produto 5. Configurações do Menu 6. Configurações de aparência e comportamento 7. Configurações de mídia social 8. Configurações Extra do Ícone 9. Configurações do Google 10. Configurações do Sitemap
Cada interface do módulo Accelerated Mobile Pages (AMP) da Knowband para Prestashop é explicada abaixo.
Configurações gerais do 3.1
A guia Configurações gerais deste addon Prestashop AMP tem as seguintes opções:
Habilitar desabilitar: Inicialmente, este campo do módulo Prestashop Accelerated Mobile Pages da Knowband será desativado. O administrador pode ativar / desativar o plug-in, alternando o botão.
A ativação dessa configuração converterá as páginas do website em AMP.
Forçar AMP no dispositivo móvel: Nesta seção do complemento Knowband Prestashop AMP, o administrador pode habilitar as configurações para páginas AMP no dispositivo móvel.
Logotipo do site: Usando essa opção do módulo de Páginas para dispositivos móveis acelerados do Google (AMP), o comerciante da loja pode carregar ou alterar o logotipo da AMP.
Logo Largura: Aqui, o administrador da loja pode definir a largura do logotipo em pixels.
Altura do logotipo: Aqui, o administrador da loja pode definir a altura do logotipo em pixel.
Ativar / desativar a página inicial AMP: O administrador da loja pode ativar / desativar as AMP na página inicial do site. Depois de ativar a opção, o administrador pode verificar a página inicial da AMP clicando no botão Visualizar.
Ativar / desativar a AMP da página de categoria: O administrador da loja pode ativar / desativar as AMP nas páginas da categoria. Depois de ativar a opção, o administrador pode verificar a página da categoria AMP clicando no botão Visualizar.
Ativar / desativar a página do produto AMP: Usando esta opção do complemento Prestashop Accelerated Mobile Page (AMP), o administrador da loja pode habilitar AMP nas páginas do produto AMP do site e visualizar o mesmo clicando no botão PREVIEW.
Ativar / desativar o AMP da página do CMS: O Prestashop AMP Page Module oferece a opção de o revendedor da loja converter a página do CMS em AMP. A aparência das páginas pode ser visualizada clicando no botão Visualizar.
CSS customizado: O administrador da loja Prestashop pode adicionar o código CSS personalizado conforme os requisitos de negócios nesta seção.
Configurações da Página Inicial do 3.2
Nesta aba do addon da Prestashop Accelerated Mobile Pages (AMP) da Knowband, o administrador pode ativar / desativar a exibição de novos lançamentos, best sellers e produtos em destaque na página inicial da AMP deste módulo Prestashop em vários idiomas. Esta aba terá as seguintes opções:
1. Configurações da Página Inicial 2. Configurações do produto em destaque 3. Melhores configurações de produto de venda 4. Novas configurações do produto de chegada
Configurações da Página Inicial do 3.2.1:
Exibir texto personalizado: O administrador pode ativar / desativar a opção de texto personalizado aqui.
Texto personalizado: Neste addon do Google Accelerated Mobile Pages, o administrador da loja pode alterar o texto do bloco da Página inicial.
Posição de exibição: O administrador pode selecionar a posição de exibição que será refletida no front end do site.
Configurações de produtos em destaque do 3.2.2:
Ativar produtos em destaque: Usando essa opção da extensão Prestashop AMP, o administrador da loja de comércio eletrônico pode ativar / desativar a seção de produtos em destaque.
Exibir produtos em destaque no Carousel: Aqui, o administrador da loja pode incluir os produtos em destaque no carrossel.
Exibição aleatória: O administrador da loja pode ativar / desativar a opção de exibição de produtos aleatórios. Depois de ativar esse recurso, a exibição aleatória do produto na seção específica em AMP.
Selecione Produtos: O addon de páginas móveis aceleradas Prestashop da Knowband permite que o administrador da loja selecione o número de produtos que deseja exibir na seção Produto do recurso.
Banner de exibição: O comerciante de comércio eletrônico pode ativar / desativar a opção de banner de exibição.
Banner de upload: Nesse campo, o administrador da loja pode fazer o upload do banner para o produto em destaque.
Configurações de Produtos Mais Vendidos da 3.2.2:
Nesta guia, o administrador da loja Prestashop pode personalizar as configurações do produto mais vendido. Consulte a captura de tela anexada abaixo:
Novas configurações de produtos da 3.2.3:
O administrador tem controle sobre a exibição das posições do produto New Arrival nas páginas AMP.
Configurações da página de categoria 3.3
A guia Configurações da página da categoria do complemento Prestashop Accelerated Mobile Pages permite que o administrador adicione o texto e as imagens. Além disso, o administrador também pode definir a posição do texto na página de categoria. Esta aba terá as seguintes opções:
Exibir texto personalizado: O administrador pode ativar / desativar a opção de mensagem personalizada.
Texto personalizado: Usando essa opção do módulo AMP da Prestashop, o administrador da loja de comércio eletrônico pode definir a mensagem da página da categoria.
Posição de exibição: Nesta guia, o administrador da loja pode alterar a posição de exibição conforme os desejos. Essas alterações serão refletidas na frente da loja.
Tamanho da imagem do produto: O administrador da loja Prestashop pode definir o tipo de imagem aqui.
Configurações da Página do Produto 3.4
O administrador tem controle sobre as configurações da página do produto nas páginas AMP. Esta aba terá as seguintes opções:
Exibir texto personalizado: O administrador pode ativar / desativar a opção de mensagem personalizada.
Texto personalizado: Usando essa opção do Módulo AMP do Prestashop, o administrador da loja de comércio eletrônico pode definir a mensagem da Página de Categoria.
Posição de exibição: Nesta opção, o administrador da loja pode alterar a posição de exibição conforme os desejos. Essas alterações serão refletidas no front-end da loja.
Tamanho da imagem do produto: O administrador da loja Prestashop pode selecionar o tamanho da imagem a ser exibido aqui.
Breve descrição: Nessa opção, o administrador da loja pode mostrar a descrição resumida do produto, ativando esse recurso.
Exibir descrição longa: O dono da loja tem uma opção para mostrar a longa descrição do produto conforme o requisito.
Exibir análise do produto: Ao usar o módulo Prestashop Accelerated Mobile Pages, o administrador da loja pode ativar a opção de revisão do produto. Depois de ativar esse recurso, a revisão do produto será mostrada no front-end da loja.
Exibir informações adicionais: Ao ativar esse recurso, o administrador pode mostrar as informações adicionais dos produtos.
Exibir produtos relacionados: Ao ativar essa opção, o administrador da loja pode exibir o produto relacionado. Essas alterações serão refletidas na frente da loja.
Configurações do Menu 3.5
Nesta aba, o administrador do armazenamento Prestashop pode configurar os menus no AMP. O administrador pode até adicionar novas opções de menu. Esta aba terá as seguintes opções:
Habilitar desabilitar: O administrador pode ativar o AMP nos menus, alternando o botão.
Título do menu: O Prestashop AMP Addon da Knowband permite que o administrador da loja adicione o Menu inserindo o título aqui.
Item de menu pai: Aqui, o comerciante de comércio eletrônico pode selecionar o menu principal de acordo com o desejo.
Tipo de Item de Menu: O administrador pode selecionar o tipo de item do menu.
Selecione a Categoria: O administrador da loja pode selecionar a página específica em que deseja redirecionar o usuário para a página AMP definida.
NOTA: Estas alterações são mostradas na seção Estrutura do menu.
Configurações do 3.6 Look and Feel
O administrador pode controlar as configurações de cor, personalizar as cores AMP do site de acordo com suas necessidades. Eles podem alterar as cores da página AMP de acordo com o seu tema e suas preferências. Esta aba terá a seguinte seção:
1. Configurações Gerais 2. Configurações da lista de produtos 3. Categoria Configurações 4. Configurações do produto
Configurações gerais do 3.6.1
Nesta guia do addon Prestashop Accelerated Mobile Pages (AMP) da Knowband, o administrador pode personalizar as configurações da página inicial da AMP. Esta aba terá as seguintes opções:
Cor de fundo: The Admin can change the background color of the home page.
Cor da fonte: The admin can change the font color from this section.
Header Background Color: This field of Prestashop Accelerated Mobile Pages (AMP) Module allows the admin to set the header background color.
Header Font Color: Using this option of the Prestashop AMP module, the admin can set the font color of the text displayed in the Header section.
Header Icon Color: The Prestashop store admin can change the icon color of the.
Footer Background Color: This option of the Google Accelerated Mobile Pages(AMP) Module allows the admin to set the background color of the Footer.
Footer Font Color: The admin can change the font color from this section.
Footer Icon Color: The admin can change the icon color from this section.
Footer Lower Bar Background Color: The Store merchant can change the background color of the Footer Lower Bar.
Left Menu Slider Background Color: The Prestashop Merchant can change the Left menu slider background color in this section of Knowband Accelerated Mobile Pages(AMP) For Prestashop.
Left Menu Header Background Color: The Prestashop store admin can change the left menu header background color as per the requirement.
Left Menu Slider Font Color: The admin can change the font color from this section.
Left Menu Sidebar Icon Color: The admin can change the icon color from this section.
Header Left Background Color: In this section of Prestashop Accelerated Mobile Pages(AMP) Module allows the admin to set the header left background color.
3.6.2 Product Listing Settings
The admin can customize the settings of the Product listing as per the requirement. Below mentioned the option:
Product Title Color: In this section of Google Accelerated Mobile Pages(AMP) Module allows the admin to change the Product title color.
Product Title Font Size: The Store admin can set the font size of the Product.
Adicionar ao carrinho Cor do botão: Knowband’s Prestashop AMP Pages module allows the admin to change the Add to Cart Button Color as per desires.
Add to Cart Button Font Color: The admin can customize the font color of the Add to Cart button.
Add to Cart Font Size: The Store admin can set the font size of the Add to Cart button.
3.6.3 Category Settings
In this tab, the store admin can customize the settings of the Category pages. These changes will be reflected in the front of the store.
Category Heading Font Color: The Prestashop store admin can change the category heading font color as per the requirement.
Category Heading Font Size: The admin can change the font color from this section.
3.6.4 Product Settings
In this section, the Admin can customize the Product settings as per the requirement. The configuration option of this section is same as discussed in the Product listing section.
3.7 Social Media Settings
In this section of the Prestashop AMP module, the store admin can enable/disable the social media sharing option on the AMP webpages. All the enabled social media sharing options will be shown on the AMP. This tab will have the following options:
Display Shop Address in Menu Bar: The Admin can show the Store address by enabling this feature.
Display Shop Email Address: The Prestashop store owner can show the email address.
Display Shop Contact Number: In this field, the store admin can display the contact details of the site.
Display Facebook Icon: The store admin has the option to display a Facebook icon in the menu bar. For this admin need to specify the Facebook page URL in the respective field.
Display Twitter Icon: This section the admin can enable/disable the Twitter icon.
Display Google Icon: By using this Option the Prestashop store merchant can display the Google icon in the menu bar. For this admin need to Specify the Google page URL in the respective field.
Display Linkedin Icon: In this section, the store admin can display the Linkedin icon here. The Store admin must need to enter the URL of the profile.
Display Tumblr Icon: The Prestashop store owner can show the Tumblr profile here.
Display Pinterest Icon: The Store admin has the option to display a Pinterest icon in the menu bar. For this admin need to Specify the Pinterest page URL in the respective field.
3.8 Extra Icon Settings
In this section, the admin can add the extra social media icon as per the requirement of the business. This tab will have the following options:
Enable Extra Icon: The Prestashop store admin can enable/disable the extra icon feature. If they want to add more social media icon then they can add here with an ease.
Icon Class: The Admin can enter the Icon class.
URL do ícone: In this tab, the store admin can Icon URL as per desires. These changes will be reflected in the front of the store.
3.9 Google Analytics Settings
Admin will need to have the Analytics Client ID in order to configure this feature.
Enable Google Analytics: If you want to track the performance of the accelerated mobile pages of your site, this feature allows the admin to enter Google Analytics client.
Analytics Client Id: The eCommerce merchant can enter your Google analytics client ID to configure.
3.10 Sitemap Settings
In this section, the store admin can generate the AMP Sitemap by clicking the button.
Generating the Sitemap are here.
How to Generate Sitemap for AMP?
The Admin can generate Sitemap by running CRON.
Accelerated Mobile Pages(AMP) module allows the store admin to setup Cron via
URLs to Add to Cron via Control Panel
Cron setup via SSH
CRON?Configuration:
In order to generate the Sitemap automatically, the Prestashop store admin can set up the cron job. There are two options available in the admin panel of the module.
1.? The?Admin?can?run?the?cron?manually.
Add the cron to your store via control panel/putty to generate/update the sitemap. Please find the instructions to setup crons below –
URLs to Add to Cron via Control Panel
Generate Sitemap?-
https://pstest2.knowband.com/ps1617/en/module/kbamppages/cron?action=syncSiteMap&secure_key=05d25b0b5a4a46268677e35c06cc51ef
Configuração Cron via SSH
Generate Sitemap?- 40 * * * * curl -O /dev/null
‘https://pstest2.knowband.com/ps1617/en/module/kbamppages/cron?action=syncSiteMap&secure_key=05d25b0b5a4a46268677e35c06cc51ef’
4.0 Front Interface of the Prestashop Accelerated Mobile Pages Module:
After enabling the Prestashop Accelerated Mobile Pages(AMP) Module by Knowband the store admin can enable the settings for the home page, category pages, product pages and CMS pages. As per the settings enabled by the admin, AMP will look as shown below:
Home Page:
Prestashop AMP Pages allows the admin to show the Best Seller, New Products and Features Product on the Home page. For better user engagement.
categoria Página
As per the setting enabled by the admin, the Category AMP Pages on the Mobile device will appear like this screenshot.
Página do produto
As per the setting enabled by the admin from the back-office the layout of Product AMP Page on the Mobile device will appear like this screenshot.
CMS Page
The Admin can view the CMS page setting like below settings.
Ícone Menu
Prestashop Accelerated Mobile Pages shows the Menu icon like this.