La pesta a Vkontakte es una herramienta conveniente que le permite integrar una comunidad oficial o una p gina p blica de Vkontakte en su sitio web. Esto es muy conveniente para los usuarios que desean combinar el contenido de su p gina de Vkontakte con su propio recurso en l nea.
En este art culo, le diremos c mo insertar correctamente la pesta a Vkontakte en su sitio web. Hemos preparado instrucciones detalladas paso a paso que le ayudar n a dominar esta manera f cil y conveniente de integrar la red Vkontakte en sus proyectos en l nea.
Solo le tomar unos minutos dominar este proceso y el resultado superar sus expectativas. Entonces, comencemos a estudiar las instrucciones para insertar la pesta a Vkontakte en el sitio.
- Registrarse en Vkontakte y crear un grupo
- Crear un widget de Pesta a en una p gina de grupo
- Configuraci n de la apariencia de la Pesta a
- Obtener el c digo para insertar en el sitio
- Crear y configurar una p gina para una Pesta a en un sitio
- Insertar c digo de Pesta a en el sitio
- Comprobaci n del estado de la Pesta a
Registrarse en Vkontakte y crear un grupo
Para insertar una pesta a de Vkontakte en su sitio web, debe tener una cuenta de Vkontakte y crear un grupo que desee Mostrar en su recurso web.
- Vaya al sitio web oficial de Vkontakte.
- En la esquina superior derecha de la p gina, busque el bot n "Registrarse" y haga clic en l.
- Complete la informaci n requerida en el formulario de registro: su nombre, apellido, fecha de nacimiento, sexo, n mero de Tel fono o correo electr nico, y cree una contrase a.
- Realice el proceso de verificaci n, ingrese su n mero de Tel fono o pase una verificaci n de humanidad.
- Despu s de registrarse con xito e iniciar sesi n en su cuenta, busque el icono "Mi p gina" en el men superior y haga clic en l.
- En su p gina de perfil, en el men de la izquierda, busque la secci n "Grupos" y vaya a ella.
- En la esquina superior derecha de la p gina, busque el bot n Crear comunidad y haga clic en l.
- En la ventana que aparece, seleccione el tipo de comunidad: p blico, privado o privado.
- Complete todos los campos necesarios, como el nombre del grupo, la descripci n, la direcci n del grupo, as como configure la privacidad y otras opciones.
- Despu s de completar todos los datos, haga clic en el bot n "Crear".
Felicidades, te registraste con xito en Vkontakte y creaste un grupo que usar s para insertar una pesta a en tu sitio.
Crear un widget de Pesta a en una p gina de grupo
Para crear un widget de Pesta a en la p gina del grupo de Vkontakte, siga estos pasos::
- Inicie sesi n en el sitio web de Vkontakte y vaya a la p gina de su grupo.
- Haga clic en la pesta a Administrar en el men superior de la p gina.
- En el men de la izquierda, seleccione "Trabajar con API" y vaya a la secci n "Widgets".
- Haga clic en el bot n "Crear widget" y seleccione el tipo de widget "Pesta a".
- Complete la configuraci n requerida seg n sus preferencias:
- Nombre del widget: especifique el nombre que se mostrar en la pesta a de la p gina del grupo.
- Enlace a un sitio externo: especifique la URL de la p gina web que desea Mostrar dentro de la pesta a.
- Ancho y alto en p xeles: configure las dimensiones del widget para que se ajusten a su dise o.
Despu s de completar la configuraci n, haga clic en el bot n "Guardar" y se crear el widget.
Para agregar el widget creado a la p gina de grupo, siga estos pasos::
- Vaya a la p gina de configuraci n del widget haciendo clic en su nombre en la lista de widgets.
- Copie el c digo del widget que aparece en el Campo c digo de inserci n del sitio.
- Abra el Editor de c digo de su sitio y pegue el c digo copiado en la p gina deseada.
Despu s de guardar los cambios en su sitio, el widget de la Pesta a se mostrar en la p gina del grupo Vkontakte.
Configuraci n de la apariencia de la Pesta a
La pesta a Vkontakte en el sitio se puede personalizar de acuerdo con sus preferencias y estilo del sitio. Para hacer esto, necesitar alg n conocimiento sobre CSS y las capacidades de Vkontakte.
La apariencia de la Pesta a se puede personalizar con estilos CSS. Para hacer esto, deber especificar el id del bloque en el que se encuentra la Pesta a. Por ejemplo, si su bloque tiene el identificador "VK-tab", los estilos de la pesta a se pueden definir de la Siguiente manera:
#vk-tab {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
font-size: 14px;
border: 1px solid #ccc;
- padding: 10px;
- }
El ejemplo muestra las propiedades b sicas que se pueden configurar para una Pesta a. Puede cambiar el color de fondo, la fuente, el Tama o de fuente, los bordes y el relleno para adaptarse al estilo de su sitio.
Adem s, Vkontakte proporciona algunas opciones para personalizar la apariencia de la Pesta a. Por ejemplo, puede especificar el ancho y la altura de una Pesta a con las opciones "ancho" y "altura". Por ejemplo:
VK.Widgets.Tab("vk-tab", {width: 300, height: 400});
En este ejemplo, la Pesta a tendr 300 p xeles de ancho y 400 p xeles de alto. Puede cambiar estos valores de acuerdo a sus preferencias y necesidades.
Tambi n puede personalizar la visualizaci n del bot n "Enviar solicitud". El bot n tiene varios Estados: "Oculto", "siempre se Muestra", "solo se Muestra al pasar". Para hacer esto, use la opci n "buttonType" y especifique uno de los tres Estados:
hidden-el bot n se ocultar .
always-el bot n se mostrar siempre.
hover: el bot n solo se mostrar cuando pase el cursor sobre una Pesta a.
VK.Widgets.Tab("vk-tab", {buttonType: "always"});
En el ejemplo anterior, el bot n "Enviar solicitud" siempre se mostrar . Puede elegir el estado adecuado seg n sus preferencias y requisitos.
Por lo tanto, la configuraci n de la apariencia de la Pesta a Vkontakte en el sitio puede ser bastante flexible y le permitir integrarla con su sitio y darle un estilo adecuado.
Obtener el c digo para insertar en el sitio
- Pasos necesarios para obtener el c digo de inserci n de la Pesta a Vkontakte en el sitio:
- Abra el sitio de la Pesta a Vkontakte en su navegador.
- Inicie sesi n en su cuenta de Vkontakte utilizando sus credenciales.
- En la p gina principal de la Pesta a Vkontakte, haga clic en el elemento de men de la Pesta a en la barra de navegaci n superior.
- Haga clic en El bot n crear pesta a para comenzar a crear una nueva Pesta a.
- Seleccione el tipo de Pesta a que desea agregar (por ejemplo, "Mis grupos" o "mis juegos") y complete todos los campos requeridos.
- Despu s de completar los campos, haga clic en Guardar o Crear para crear una Pesta a.
- En la p gina de configuraci n de la Pesta a, busque la secci n Insertar en el sitio.
- Copie el c digo de inserci n resultante, que se presentar como c digo HTML.
- Despu s de recibir el c digo de inserci n, puede pegarlo en su sitio web, en el lugar correcto para Mostrar la Pesta a Vkontakte.
Crear y configurar una p gina para una Pesta a en un sitio
Para agregar una Pesta a de Vkontakte a su sitio web, debe seguir varios pasos:
Abra el Editor de Pesta as Vkontakte.
- Haga clic en el bot n "Crear" para crear una nueva Pesta a.
- En El campo nombre de la Pesta a, ingrese el nombre de su p gina.
- Seleccione el tipo de contenido que se mostrar en su Pesta a. Puede ser un sitio externo, un c digo HTML o una aplicaci n de Vkontakte.
- Si ha seleccionado un sitio externo, ingrese la URL de su sitio en el campo "URL".
- Si ha seleccionado el c digo HTML, pegue su c digo HTML en el campo correspondiente.
- Si ha seleccionado la aplicaci n Vkontakte, seleccione la aplicaci n deseada de la lista.
- Configure las opciones de visualizaci n de la Pesta a, como el Tama o, el favicon y el t tulo.
Guarde la configuraci n haciendo clic en el bot n "Guardar".
Copie y pegue el c digo generado en su sitio en el lugar correcto para que la Pesta a aparezca en la p gina.
Despu s de completar todos estos pasos, la Pesta a Vkontakte deber a aparecer en su sitio y mostrar el contenido de acuerdo con su configuraci n. Tambi n puede personalizar y cambiar la Pesta a en cualquier momento con el Editor de Pesta as Vkontakte.
Insertar c digo de Pesta a en el sitio
Para insertar la Pesta a Vkontakte en su sitio web, deber seguir algunos pasos simples:
Vaya al sitio web de la Pesta a Vkontakte, que se encuentra en: https://vk.com/apps?act=manage.
Inicie sesi n en su cuenta usando su nombre de usuario y contrase a de Vkontakte.
Haga clic en el bot n "Crear aplicaci n".
Complete todos los campos necesarios en el formulario de creaci n de la aplicaci n: nombre de la aplicaci n, plataformas y otras configuraciones. Despu s de completar, haga clic en el bot n Guardar.
En la p gina de configuraci n de la aplicaci n, busque " Pesta as "y vaya a"Crear una nueva pesta a".
Seleccione el tipo de pesta a que necesita y personalice sus opciones.
Copie el c digo de inserci n de la pesta a resultante y p guelo en la p gina de su sitio donde desea colocar esa pesta a.
Ahora la Pesta a Vkontakte se insert con xito en su sitio y se puso a disposici n de los visitantes. Si es necesario en el futuro, puede cambiar la configuraci n de la pesta a o eliminarla.
Comprobaci n del estado de la Pesta a
Despu s de insertar la Pesta a Vkontakte en su sitio, es importante verificar su funcionamiento. En esta secci n, veremos algunas opciones de verificaci n.
1. Comprobaci n de la visualizaci n: