2. Pintar el texto de una determinada pregunta.
3. Variable para pintar el botón de Votar.
1. Listado de participantes.
En esta página puedes utilizar cualquier de las variables que usamos en la página de "gracias por participar", además de la siguientes variable:
- {{{ participation_list_header }}}: cabecera personalizada del listado de participaciones.
Y la siguiente clase:
- x_cool_tabs_share_button: enlace a compartir la campaña.
Al personalizar el listado de participantes, puedes incluir el iterador {{#list_participations}} con el que pintarás a los participantes de tu campaña.
Ejemplo:
<div>
<ol>{{#list_participations}}
<li class="rank_position_{{{ quizz_points_ranking_position }}}">
<span>{{{ quizz_points_ranking_position }}}</span>
<span>{{{tag_avatar}}}</span>
<span>{{ first_name }} {{ last_name }}</span>
<span>{{quizz_points}} puntos</span>
</li>
{{/list_participations}}</ol>
</div>
<div>
{{{ paginator }}}
</div>
El resto de variables que aparecen dentro del ejemplo: {{{ quizz_points_ranking_position }}}, {{{ quizz_points_ranking_position }}}, {{{tag_avatar}}}, {{ first_name }} {{ last_name }} y {{quizz_points}} son opcionales y pueden ponerse todas aquellas que se quieran mostrar. En cuanto al paginador {{ paginator }}, podremos modificarlo en la edición de nuestra campaña, en la sección de Participaciones, en la pestaña Listado.
2. Pintar el texto de una determinada pregunta.
Con las siguientes variables se pintará el texto de la pregunta del quiz número N.
{{{ question_quiz_1 }}}, {{{ question_quiz_n }}}
Por ejemplo, si un quiz tiene 20 preguntas, pero se pintan de manera aleatoria 5, esas variables pintarán las preguntas que ha respondido el usuario, no las primeras 5 del quiz. Aunque es importante recordar que sólo se pintará en participantes que hayan respondido a esas preguntas.
3. Variable para pintar el botón de Votar.
Con esta variable pintaremos el botón de Votar donde creamos oportuno. Por lo general, se suele activar cuando es un quizz de votaciones.
{{{ voting_form }}}
4. Cabecera personalizada.
Habitualmente en el listado público de participantes y en la página de cada participación individual aparece un encabezado por defecto donde incluimos la imagen principal de la campaña redimensionada y la descripción de la campaña con el botón de "Compartir" y "Participa", además de los detalles de zona horaria de la campaña y la fecha hasta la que se pueda participar y/o votar.
Puedes incluir una cabecera personalizada en el campo que hemos habilitado en la sección "Diseño". Nos centraremos en el check de "Cabecera del listado de participantes y participante individual" en la pestaña de Contenido.
Al utilizar este campo, ya no aparecerán los elementos por defecto y podremos incluir con html lo que necesitemos. Si nos interesa mantener los botones de "Compartir" y "Participa", deberemos incluir las siguientes clases por css:
x_cool_tabs_share_button_participation => Compartir
x_cool_tabs_participate_button => Participa
Ejemplo:
El html que hemos incluido en la cabecera es una imagen mapeada que lleva a "Compartir" y a "Participa" cuando se hace clic en ese texto de la imagen:
<div id="canvas" style="position: relative; width: 579px; margin: 0px auto; height: 174px;"><img id="bgImage" style="display: block; position: relative; z-index: 1;" src="https://d1gfwauryv0c0u.cloudfront.net/assets/pictures/e4e118b0c99711e58a08fb0cd9262203/content_encabezado-votos.png"><a style="position: absolute; width: 81px; height: 33px; display: block; z-index: 10; top: 114px; left: 42px; text-indent: -9999em; border: none; background: url("https://cooltabs.github.io/image-mapify/images/transparent.gif");" href="#" class="x_cool_tabs_share_button_participation"target="_blank"></a><a style="position: absolute; width: 84px; height: 25px; display: block; z-index: 10; top: 147px; left: 39px; text-indent: -9999em; border: none; background: url("https://cooltabs.github.io/image-mapify/images/transparent.gif");" href="#" class="x_cool_tabs_participate_button" target="_blank"></a></div>
5. Otras especificaciones.
Si tienes alguna consulta durante el proceso, no dudes en contactar con nosotros a través del chat de nuestra web o nuestro mail de soporte help@cool-tabs.com
6. Contenido relacionado.
También puedes personalizar:
Comentarios
0 comentarios
Inicie sesión para dejar un comentario.