Si ets nou aquí, pot ser que vulgui subscriure's al meu RSS feed. Gràcies per la seva visita!
Caixes de Johnson és una d'aquelles coses que es refereix a tot el món i assumeix que tothom sap d'ells i com fer-ho - però en la meva experiència no ho fan. Arran de l'opció "pàgina en blanc 'la setmana passada que la majoria de la gent va veure com un potencial de vendes / pàgina compressió sembla lògic seguir amb una mica de Caixes de Johnson.
Per a qui no ho sap, que són els quadres de color amb una línia sòlida o trencada al voltant d'ells que algun text èmfasi, en general un benefici del producte, o el preu de venda - tot el que vulguis cridar l'atenció. Es tracta d'un mètode provat per a l'augment de conversions. Llavors, com fan?
En primer lloc es necessita el tros de codi que anar en el seu custom_css.php que especifica l'estil i el tipus de caixa, a continuació, la NED per posar alguna cosa en el text de la seva pàgina en què crida a la casella.
Una versió senzilla es dóna aquí - es pot elaborar-hi el que vulguis, però això li donarà un quadre bàsic
/*--Johnson-Box--*/
div#johnson-box{
display: center;
background: #YOUR-COLOR-CHOICE-HERE;
border: YOUR-BORDER-WIDTH-HEREpx solid #YOUR-COLOR-CHOICE-HERE;
width: YOUR-WIDTH-HEREpx;
height:YOUR-HEIGHT-HEREpx;
text-align: center;
}
/*--End Johnson-Box*/
Això li donarà una caixa centrada amb el text centrat i una línia sòlida al voltant d'ell. La línia contínua no vol ser molt més que 4px i sovint menys. Si voleu una frontera trencada, just substituir "sòlid" amb "guions". Si voleu una alçada de líquid per al seu quadre, simplement et perdis la línia d'alçada.
Per utilitzar el lloc següent en el quadre de text de la seva pàgina (utilitzant l'editor d'HTML, no el visual a WP)
<div id="johnson-box">
YOUR TEXT AND IMAGES HERE
</div>
Això és el que utilitza per generar el quadre de sota encara que el color més habitual de la frontera és # cc0000
/*--Johnson-Box--*/
div#johnson-box{
display: block;
background: #f3edfc;
border: 4px dashed #cc99ff;
width: 600px;
height:60px;
text-align: center;
}
/*--End Johnson-Box*/
i això és el que vaig posar a la meva pàgina: --
<div id="johnson-box">
This is a Johnson Box
</div>
Si voleu més d'un estil de Johnson Caixa llavors només donar a cada un configurar un nom diferent div.
També pot utilitzar un estil en línia, però em sembla la versió de CSS més fàcil quan em la creació de plantilles, però en nom de l'exhaustivitat, aquí està el codi, que es faria servir en l'editor HTML.
<div style="display: center; background: #YOUR-COLOR-CHOICE-HERE; border: 1px solid #YOUR-COLOR-CHOICE-HERE; width: YOUR-WIDTH-HEREpx; height:YOUR-HEIGHT-HEREpx; text-align: center;">
YOUR TEXT AND IMAGES HERE
</div>
Això pot ser una mica bàsic perquè alguns de vosaltres, però espero que sigui útil a algú per aquí.
comment } (1 comentari)
