Popup

Afficher un message promotionnel via une popup

Le plugin Bloom permet de créer des "optins" pour récupérer des adresses emails via un système de popups, fly in, bloc dans du contenu, etc.

On va détourner ce plugin pour afficher des messages promotionnels.

Créer une première popup promotionnelle

Dans la barre latérale, allez dans "Bloom". Cliquez sur le bouton New optin pour créer un optin.

Sélectionnez le type d'optin désiré (popup, fly in, etc.) et validez.

Dans la partie "Setup", donnez un nom à l'optin. Dans la liste déroulante "Select Email Provider", choisissez "Custom HTML Form". Validez.

Dans la partie "Design", choisissez un template (on va partir sur le premier de la deuxième ligne). Validez.

Dans le formulaire qui apparait :

• donnez un titre et une description à l'optin,

• sélectionnez "No image" dans "Image Orientation",

• indiquez #161616 pour "Background Color",

• Copiez-collez le code suivant dans "CUSTOM CSS" :

.et_bloom_form_content {
  display: none;
}
.et_bloom .et_bloom_form_container a {
  display: inline-block;
  margin-top: 20px !important;
  background: #F6BB32;
  color: #FFFFFF;
  line-height: 20px !important;
  font-size: 16px !important;
  padding: 10px 20px !important;
  border-radius: 5px;
  text-align: center;
  text-decoration: none;
  text-transform:uppercase;
  font-weight: 700 !important;
}
.et_bloom .et_bloom_form_container a:hover {
  background: #e3a20a;
}
.et_bloom .et_bloom_form_header .et_bloom_form_text {
  text-align: center;
}

En cliquant sur le bouton bleu avec un oeil, vous avez une prévisualisation de l'optin.

Passez à l'étape suivante pour définir les paramètres d'affichage de l'optin. Dans "Display On", vous pouvez par exemple définir sur quelles pages (ou type de pages) l'optin apparait.

Créer les popups promotionnelles suivantes

Pour éviter tout le paramétrage précédent, vous pouvez dupliquer une optin pour créer les popups suivantes.