Cómo hacer un menú gráfico en VK. Conceptos básicos del marcado Wiki para crear un menú para un grupo VK. Menú cerrado y abierto
Como sabes, cuando una persona lee o accede a un recurso web en particular, presta atención al diseño y la interfaz durante los primeros 8 segundos. Al mismo tiempo, se asegura de la buena o mala usabilidad (facilidad de uso). Un menú en un grupo en la red social VKontakte, del que hablaremos hoy y veremos el principio de su construcción con un ejemplo, le permite no solo presentar información de manera colorida y "distinguirse" de sus competidores para mejor, sino también también para identificar exactamente aquellos elementos y realizarles los cambios de acento que sean necesarios.
Basta con mirar algunos ejemplos para comprender lo hermoso y conveniente que es:
Empecemos. Para empezar, cabe señalar que si desea crear el menú usted mismo desde cero, necesitará toda la siguiente información. Si ya tiene un diseño, puede omitir parte del artículo e ir directamente a su ubicación y marcado wiki.
Diseño de menú
Le permite completar la base para un proyecto futuro. Para realizar esta parte del trabajo es bienvenido el conocimiento de algún programa como Adobe Photoshop. Así es como se ve la plantilla de tamaño en la que implementaremos el futuro hermoso menú.
El ancho del avatar es de 200 píxeles, la altura es de 500. La imagen del menú principal es de 510*308. Como resultado, obtendremos un "menú" tan hermoso al final.
Tenga en cuenta que dependiendo de la información escrita después del nombre del grupo, la altura de la imagen de la derecha (avatar) puede cambiar y, en consecuencia, ¡todo lo que se encuentre cerca puede cambiar!
Esta fuente de diseño PSD se implementó como ejemplo. Descargar .
No nos centraremos en cómo se hizo la plantilla; inmediatamente comenzaremos a prepararla para colocarla en un grupo nuevo o existente. Abra el archivo en Photoshop.
Primero que nada, guarda el avatar. Una de las formas de guardar rápidamente si todo el contenido del archivo está estructurado y hay pocos elementos (como en nuestro caso). Desactiva la visibilidad de las capas que no necesitamos.
Vaya a la sección "Imagen" y seleccione la operación "Recortar".
En la salida obtenemos:
Si la imagen resultante es grande, puede utilizar la herramienta "Guardar para Web". El comando también se encuentra en la sección "Archivo".
Realizamos una operación similar con la imagen que se mostrará cuando se muestre inicialmente el menú. En nuestro caso dejamos visible la carpeta “menú abierto” y el “fondo del menú” en la carpeta “menú con coche”. El resultado es:
Ahora necesitas guardar y cortar el segundo nivel del menú. Para hacer esto, deje el “fondo del menú” visible en la carpeta “menú con auto” y agregue “Menú de segundo nivel”.
Luego usaremos la herramienta “Cortar”, que se encuentra en el menú de la izquierda.
"Cortamos" nuestra imagen en las partes apropiadas. En nuestro caso serán tres.
Esto completa la parte preparatoria. Pasemos al escenario principal.
Marcado Wiki del menú terminado en VKontakte.
En primer lugar, debe cargar una foto grupal o un avatar haciendo clic en el enlace del mismo nombre y seleccionando el archivo que necesitamos.
Luego asegúrese de realizar la siguiente secuencia de acciones. Vaya a "Gestión de la comunidad" y en el elemento "Secciones" frente al botón "Materiales", seleccione "Restringido".
Esto debe hacerse para que los usuarios y miembros del grupo no puedan cambiar y/o editar elementos adicionales, incluidos los menús.
Una vez completada la operación, cargamos nuestras imágenes cortadas en el álbum comunitario.
Vaya a la sección "Últimas noticias", seleccione "Editar" y acceda al menú del editor.
Para acelerar el proceso, use la tecla "Cámara" y haga clic en "Seleccionar entre fotos de la comunidad".
Después de agregar, regrese al menú del editor y presione "<>", en el que realizaremos más ediciones. Inmediatamente también cambiamos el nombre de la sección y en lugar de “Últimas noticias” escribimos en nuestro caso “MENÚ DE GRUPO”.
La estructura general de cada parte cortada se ve así en el marcado - [], donde:
id – identificador (número) de la imagen que subiste;
X e Y: tamaño de imagen horizontal y vertical en píxeles;
Al mirar la plantilla, editamos nuestro marcado wiki y periódicamente vamos a la sección "Vista previa", que muestra visualmente los cambios que hemos realizado.
Todas las imágenes deben cerrarse con una etiqueta a la vez (y no, como es predeterminado, cada imagen)
Como ya hemos dejado la etiqueta que centra la imagen sola, para eliminar las distancias "desagradables" entre partes de la imagen general, debemos insertar la etiqueta "nopadding" de la siguiente manera: []
Esto es lo que sucede al final.
Ahora debes hacer clic en la pestaña “MENÚ DE GRUPO” y luego en “editar”.
¡Importante! Para copiar la dirección requerida, en nuestra versión, haga clic en el “MENÚ DE GRUPO” y copie el “enlace correcto” desde allí.
Vaya a la página principal y haga clic en "Agregar entrada". ¡No olvides cambiar inmediatamente el autor de la publicación!
Haga clic en las "elipses" a la derecha de la entrada y haga clic en la pestaña "Fijar".
Después de eso, actualice la página y disfrute del resultado resultante, que se ve así:
Al hacer clic en "Abrir menú".
Como ves, hacer un menú en la red social VKontakte es bastante fácil y sencillo. Basta con tener un ligero nivel de conocimientos sobre el uso de Photoshop y el marcado wiki. Cuanto mejor y más intuitivo sea el diseño, más dispuesto y frecuente será el usuario potencial que vendrá y regresará a su grupo.
Si desea un diseño de grupo verdaderamente único e impresionante que cumpla con el estilo corporativo y los elementos que lo acompañan, comuníquese con un diseñador profesional o puede probar usted mismo el alcance de sus talentos. ¡Buena suerte en todos tus esfuerzos!
Hoy volvemos nuevamente al tema del diseño de grupos VKontakte. Ya hemos aprendido antes. Hoy aprenderemos a hacer gráficos. menú con banner superior fijo y un enlace a una página interna con elementos de menú ampliados. En general, cualquier información puede estar en la página interna. Es especialmente conveniente colocar allí, por ejemplo, catálogos con una gama de productos. Tanto los menús desplegables como los menús fijos tienen sus ventajas y desventajas. La principal desventaja de un menú desplegable es que está cerrado de forma predeterminada. Pero puedes colocar varios enlaces a la vez.
Menú fijado parece más impresionante debido a la impresión general, pero solo puede tener un enlace que conduzca a la página interna de VKontakte o a un sitio externo (y el enlace al sitio externo no provendrá de la imagen, sino del enlace de texto debajo la imagen). Además, una de las desventajas obvias es que en los dispositivos móviles el menú gráfico se presenta como una entrada normal en el feed, situada en la parte superior y no fijada al lado del avatar. En general, a la hora de elegir un diseño debes tener en cuenta estos matices. Entonces, veamos cómo crear un menú superior fijo con un enlace a una página interna.
Creo grupos en VKontakte
Diseño de alta calidad de grupos VK y páginas públicas, menú fijado, menú desplegable, menú gráfico interno, catálogos, navegación interna. precios Y cartera.
Paso 1
Cree un nuevo documento en Photoshop de aproximadamente 900x700 píxeles de tamaño y rellénelo de blanco. Ahora necesitamos recortar dos ventanas en la capa, a través de las cuales será visible el diseño gráfico real. Primero, seleccione un rectángulo que mida 200x500 píxeles (avatar) y presione Supr. Luego seleccione un rectángulo que mida 510x352 (alinéelo con la línea inferior del avatar y haga que la distancia entre las formas sea de 50 píxeles) y también presione Supr.
Después de la siguiente actualización de diseño de VKontakte (31 de octubre de 2016), las dimensiones del banner pasaron a ser 510x307 (no 510x352).
Paso 2
Ahora, debajo de la capa blanca, colocamos una imagen única, que formará la base del diseño. 
Paso 3
Después de eso, complementamos la imagen con varios elementos: un logotipo, inscripciones de texto y un botón que invita a hacer clic en el menú. Luego guardamos dos imágenes separadas en la computadora: una es un avatar (a la derecha), la segunda es un menú con un botón de clic (a la izquierda). 
Paso 4
También creamos un menú gráfico en Photoshop que consta de varios elementos. El ancho de este menú debe ser de 600 píxeles, el alto es opcional, dependiendo de la cantidad de elementos. Para ayudar, utilice la lección ““. 
Paso 5
Cortamos nuestro menú en varias franjas horizontales de acuerdo con la cantidad de elementos del menú. Guardar como archivos separados. 
Paso 6
Vamos a nuestro grupo VKontakte, hacemos clic en “Gestión comunitaria” (al hacer clic en los tres puntos debajo del autor se abre un menú desplegable) y verificamos que la configuración sea correcta. El grupo debe ser abierto y los materiales también deben ser abiertos. 
Paso 7
Ahora subimos un nuevo avatar. Mueva el mouse a la ubicación del avatar y seleccione "Actualizar foto" en el menú emergente. Cargue la foto correcta del Paso 3, estire el área de selección hacia arriba y hacia abajo hasta los bordes de la imagen, haga clic en "Guardar" y luego seleccione el área para la miniatura redonda. 
Paso 8
Ahora necesitas crear una página interna. Cómo hacer esto se describe en detalle en la lección. Otra forma alternativa de crear una página interna se describe en la lección “” en los Pasos 5 y 6. 
Paso 9
Una vez que hayamos creado la página interna, podremos acceder a ella. Para hacer esto, debe hacer clic en el menú desplegable del grupo (de manera predeterminada, este elemento se llama "Últimas noticias"; le cambié el nombre a "Menú") y allí hacer clic en el enlace "Menú". Luego de esto nos dirigiremos a la página en blanco recién creada. 
Paso 10
Ahora necesitamos crear un menú gráfico de cinco elementos. Para hacer esto, subimos nuestras cinco imágenes del Paso 5 al álbum grupal. Hacemos clic en el ícono de la cámara y subimos las imágenes cortadas desde la computadora. Las imágenes se almacenarán en algún lugar de los servidores de VKontakte y se vincularán al grupo, por lo que no es necesario crear un álbum separado para las imágenes recortadas. Debes cargar imágenes en modo de marcado Wiki. 
Paso 11
Ahora en modo de marcado wiki crearemos un menú gráfico. Es muy importante crear en el modo de marcado wiki (el icono en la esquina superior derecha de dos corchetes triangulares), y no en el modo de edición visual. Se describe más información sobre la creación de código en el marcado wiki en los Pasos 4 y 5 de la lección ““. También hay una plantilla de código para insertar. Si todo se hace correctamente, debería obtener un menú gráfico listo para usar, como se muestra en la siguiente figura. 
Paso 12
Ahora volvemos a la página principal del grupo, tomamos la URL de nuestra página interna (debería ser así https://vk.com/page-78320145_49821289) y la pegamos en la ventana donde se crean las noticias. Automáticamente se debería adjuntar una ventana con un enlace a esta página tan interna. Después de eso, movemos el cursor a la inscripción "Adjuntar" y adjuntamos una foto a la publicación, es decir, nuestra imagen a la izquierda del Paso 3. Después de eso, borramos la línea de la URL de la página interna, dejando un espacio vacío. ¡Importante! En este paso, debe marcar la casilla (si tiene dichos derechos, esto se aplica principalmente a grupos con un muro abierto) en la casilla de verificación "En nombre del grupo". Si no marca esta casilla, la entrada no será fijada. Finalmente, haga clic en "Enviar". 
Paso 13
Mueva el cursor a los tres puntos al lado del título de la publicación y seleccione "Fijar" en la ventana desplegable. En consecuencia, también se adjunta la noticia, si es necesario. 
Paso 14
Hay una advertencia. A veces, después de desanclar una noticia, ésta baja en el feed, según la fecha de creación, y puede ser bastante difícil encontrarla nuevamente. Por lo tanto, es mejor anotar inmediatamente en algún lugar la URL de las noticias fijadas. Para hacer esto, mueva el cursor a la hora en que se creó la noticia y haga clic en el enlace. 
Paso 15
Ahora actualizamos la página principal del grupo. Nuestro menú gráfico estará ubicado en la parte superior junto al avatar. Y cuando hacemos clic en la imagen, accedemos a una página interna con un menú de cinco elementos. 
Para que su grupo sea popular entre los usuarios, debe agregar periódicamente nuevas publicaciones, cargar fotos, videos, etc. Y para que la gente pueda navegar más fácilmente yendo a la página del grupo, es mejor crear un menú que indique los puntos principales.
Por ejemplo, tienes tu propia empresa que ofrece un determinado producto o servicio. También hay un sitio web en Internet. Entonces, el grupo VKontakte de esta empresa ayudará a atraer nuevos clientes y aumentar las ventas. El menú puede incluir los siguientes elementos: Ventanas, Puertas, Portones, Sistemas de seguridad, Materiales adicionales, Promociones y descuentos. Creamos enlaces de tal manera que al hacer clic en uno de los elementos, una persona accede a la sección correspondiente del sitio.
El menú se puede crear sin vincular a páginas de terceros en Internet. Por ejemplo, tu grupo se dedica a la música. En los párrafos se pueden indicar géneros: clásica, rock, rap, de películas indias, para recién nacidos, de dibujos animados. Cuando una persona hace clic en uno de los elementos, debería abrirse un álbum con las canciones correspondientes. En este caso, el elemento es un enlace a un álbum específico del grupo.
Hay muchos ejemplos para crear navegación en un grupo. Bueno, ahora pasemos a la práctica.
Creando un menú
Configuraciones necesarias en el grupo.
Antes de comenzar a crear el menú en sí, debe verificar algunas configuraciones en el grupo. Debes ser el creador del grupo; de lo contrario, es posible que simplemente no tengas suficientes derechos para crear la navegación.
En su página de VKontakte, en la columna de la izquierda, haga clic en "Grupos" y seleccione su grupo de la lista. Luego, debajo de tu avatar, haz clic en los tres puntos verticales y selecciona "Administrar comunidad" de la lista.
Ahora, en el menú de la derecha, vaya a la pestaña “Secciones” y en los campos “Discusiones” y “Materiales”, seleccione “Abierto” o “Restringido”. Haga clic en "Guardar".
Preparando imágenes para menús y avatares en Photoshop
Una vez que haya verificado y cambiado la configuración en el grupo, puede comenzar a crear imágenes para el avatar y el menú. Puede haber varias opciones aquí:
El menú puede ser una continuación de la imagen que aparece en el avatar;
Se puede hacer sobre una imagen separada o sobre un fondo liso; el avatar no estará asociado a él, por ejemplo, se puede representar el logotipo de la empresa;
Consideraremos la primera opción en detalle. Nuestro avatar y navegación consistirán en una imagen, que debe cortarse correctamente en partes.
Abra Photoshop y cree un nuevo archivo en él: Ctrl+N. Establezca el ancho en 760 y el alto en 500 píxeles.
Ahora, usando la herramienta Rebanar, necesitas cortar la hoja en varias áreas. Seleccione el área de la derecha con la herramienta y haga doble clic en ella para abrir una ventana con un menú. Establece el ancho en 200 y el alto en 500. Este será el avatar de nuestro grupo.
Usando la misma herramienta, seleccione otra área a la izquierda de la anterior. Para ello, el ancho es 50, la altura es 500. Esta es la distancia entre los puntos futuros y el avatar, no necesitaremos esta parte de la imagen;
Seleccione el área en la parte superior izquierda. Para ello, el ancho es 510, el alto es 182. Esta área de nuestra imagen corresponde en el grupo al área en la que están escritos el nombre del grupo, el estado y se muestran algunas pestañas. Es decir, tampoco lo necesitamos.
Como resultado, debería obtener lo siguiente: la imagen está dividida en 4 áreas. El área de la derecha es el avatar del grupo, en la parte inferior izquierda habrá elementos de menú y 2 áreas más que no serán necesarias.
Para que quede completamente claro. Cortamos una hoja en blanco. Luego agregue la imagen seleccionada. Después de guardarlo, tendremos tantas imágenes pequeñas de la forma que necesitemos como cortemos. Más adelante en la página del grupo insertaremos ciertas partes de la imagen en los lugares correctos.
A continuación, abre la imagen en Photoshop que has elegido para tu avatar y menú. Usando la herramienta Mover, arrastre la imagen a la hoja previamente cortada. Puede mover la imagen para que el área deseada sea visible.
Por ejemplo, el tamaño de mi imagen es mayor que el que elegimos para la hoja blanca. Así que lo moví para que las palmeras fueran un poco visibles y no hubiera tanto cielo allí arriba.
Después de agregar la imagen, toma nuevamente la herramienta Rebanar y corta el área en la parte inferior izquierda que dejamos para los puntos en la cantidad deseada de piezas. Por cuantos puntos quieras plantear, habrá tantas partes.
Ahora tomamos la herramienta de texto y escribimos elementos de menú en cada parte.
Eso es todo. Todo está listo. A la derecha está nuestro avatar, en la parte inferior izquierda están los puntos de navegación. Las otras dos partes de la imagen no serán necesarias.
En esta etapa, puede agregar el logotipo de la empresa en el área de la derecha (avatar) o escribir su nombre de manera hermosa.
Guarde la imagen capturada: Archivo: Guardar para Web y dispositivos, o utilice el método abreviado de teclado Alt+Shift+Ctrl+S.
Esto es lo que obtuve: la carpeta "menú" en el escritorio. Contiene imágenes seleccionadas cortadas en trozos del tamaño requerido. El más grande es el avatar, hay muchos pequeños idénticos (elementos de menú y dos innecesarios), elimínelos de la carpeta.
Ahora debe cargar las imágenes tomadas que corresponden a los puntos en su página de VKontakte. Selecciona “Fotos” y crea un nuevo álbum, lo llamé “para el menú de grupo”. Haga que el álbum sea privado para que sólo usted pueda verlo: “Editar álbum”. Agregue imágenes al álbum que correspondan a los elementos de su menú.
Luego regrese a la página principal del grupo y seleccione un avatar: "Subir foto". Esta es una de esas imágenes que acabamos de hacer en Photoshop.
Entonces, en esta etapa, deberías haber creado un álbum cerrado en la página con imágenes de elementos de navegación y haber subido un avatar para el grupo.
Crear un menú usando el marcado wiki
Comencemos a crear el menú en sí. Vaya al grupo y vaya a la pestaña "Últimas noticias". Luego haga clic en el botón “Editar”.
Puede cambiar el nombre de la propia pestaña. Escribiré “MENÚ” así. Ahora aquí necesitas agregar imágenes que correspondan a los puntos. Para hacer esto, haga clic en el icono de la cámara.
Haga clic en una de las imágenes que acaba de agregar a su perfil.
Después de eso, aparecerá en la página de edición.
Por lo tanto, agregue todas las demás imágenes para obtener la imagen del menú deseada.
Cuando se hayan agregado todos los elementos, haga clic en las dos flechas en la esquina superior derecha para cambiar al modo de marcado wiki.
Aquí elimine todas las etiquetas innecesarias como
Después del tamaño de la imagen y los valores de la barra vertical, inserte un enlace a la página a la que irá la persona haciendo clic en el elemento del menú correspondiente. Como ya escribí, el enlace puede ser a alguna página de VKontakte o a un recurso de terceros en Internet.
Así es como se verá el código después de agregar "nopadding;" y un enlace.
El resultado debería ser este: se cambió el nombre de la pestaña (MENÚ), se eliminaron los espacios entre líneas, se eliminaron los espacios entre imágenes (nopadding;), se agregaron enlaces. Haga clic en "Guardar página" y regrese a la página principal del grupo.
Esto completa el proceso de creación de navegación para el grupo VKontakte. Lo hice así. La imagen del avatar y el menú son uno. Al ir a la pestaña “MENÚ”, el usuario puede seleccionar lo que le interesa y seguir el enlace que le proporcioné.
Si le preocupa que el menú del grupo no sea visible, adjunte una foto en la que, por ejemplo, utilice flechas para indicar la presencia de una pestaña. Si tienes preguntas, hazlas en los comentarios.
Este artículo será una guía detallada y le diré cómo crear un menú para un grupo VKontakte. Un menú grupal VK bellamente diseñado contribuye a un aumento real de visitantes y al crecimiento de las ventas en el sitio.
Hola mis queridos lectores. Déjame decirte hoy cómo hacer un hermoso menú para un grupo VKontakte y completamente gratis. Por cierto, después de haber aprendido a crear este tipo de temas, puedes ganar un poco de dinero con esto -))). Ningún sitio web comercial funciona sin crear su propia comunidad en las redes sociales, especialmente VK, que garantiza la captación de nuevos clientes y la promoción de su negocio.
Pero si tu comunidad no es atractiva y como todas las demás, ¿quién querrá quedarse allí? creo que nadie!!! Así que decoremos nuestros grupos con diseños de alta calidad y aprendamos a hacerlo muy rápidamente. Antes de comenzar a crear gráficos y nuestro menú futuro, debe instalar el programa Photoshop en su computadora para seguir recortando imágenes. Muchos se preguntarán por qué es necesario recortar imágenes. El punto aquí es que para cada enlace del menú tendremos que crear una franja separada del banner general.
Hoy en día existen varios tipos de menús creados:
- Abrir con elementos activos;
- Cerrado como publicación fijada;
- Con imágenes individuales o una imagen adyacente común del banner y del menú.
La esencia de crear ambas opciones es la misma. La única diferencia principal está en los elementos adicionales y los tipos de registros, y esto se analizará con más detalle en este artículo.
Para trabajar con el menú nos ayudará. marcado wiki, que hoy está integrado en el editor de texto de VKontakte. Se diferencia del habitual en que utilizará comandos estándar para mostrar una imagen particular e insertar enlaces a los elementos necesarios. El marcado wiki en sí le permite insertar código para mostrar imágenes, videos y otros elementos.
Menú cerrado del grupo VK
En este caso, veremos a la izquierda del avatar del grupo principal un hipervínculo con la inscripción "menú de grupo", al hacer clic en él se abrirá nuestro menú con elementos e imágenes activos.
El menú se verá así:
Menú de grupo abierto (material fijado)
La idea es crear elementos de menú ya abiertos que se mostrarán en la descripción del propio grupo, donde suele mostrarse para todas las condiciones. Nuestra imagen se adjuntará a la descripción, que prepararemos con anticipación y la vincularemos a la página en la que tendremos elementos activos. Este menú se ha vuelto muy popular recientemente y tiene una gran demanda entre los clientes. Se ven así:
Cómo hacer un hermoso menú para un grupo VKontakte: instrucciones paso a paso
Entonces, en primer lugar, necesitaremos crear el avatar principal del grupo, que colocaremos a la derecha, y el talón de nuestro menú en forma de banner.
- Para un avatar de 200x332 píxeles;
- Para el banner del menú principal, 395x282 píxeles.
Como habrás notado, la altura de las imágenes es diferente y esto se hace para que las imágenes no bajen de altura y queden al mismo nivel ya que la altura del nombre y estado de la comunidad ocupa unos 50 px y Es necesario eliminar este valor de la altura del menú.
Para que quede claro, si la altura del avatar principal de un grupo es 332, entonces le restamos 50 y obtenemos la altura del menú principal igual a 282. Si las dimensiones no importan, entonces la altura se puede establecer arbitrariamente. .
El siguiente paso después de crear una comunidad será configurar los materiales, y aquí debemos prohibir a los participantes crear páginas y bloques adicionales, pero solo escribir en la pared. Para hacer esto, deberá ir a la sección debajo del avatar del grupo llamada "administración de la comunidad" donde debemos hacer que nuestros materiales sean "restringidos" como se muestra a continuación.
Ahora comencemos a crear la composición general. Por supuesto, puedes simplemente insertar una imagen en lugar de un avatar en la descripción, pero no seamos aficionados y te mostraremos cómo hacerlo de manera profesional, para que sea una imagen completa, transformándose una en otra.
Creemos un nuevo lienzo en Photoshop con unas dimensiones de 600x350 píxeles, que usaremos como plantilla recortando aberturas para nuestras imágenes. Para trabajar, necesitamos convertir los tamaños de todos los elementos y reglas a píxeles y esto se hace siguiendo la siguiente ruta: “Editar-instalación-principal” y aquí configuramos los píxeles.
El siguiente paso para crear un menú abierto es hacer recortes para el banner y el avatar, que luego recibiremos para descargar. Para ello, vaya al apartado del menú vertical izquierdo y seleccione cortar.
Usando el botón izquierdo del mouse, como si estuviera seleccionando un área, debe seleccionar bloques del tamaño que necesitamos y después de cada selección, presionar el botón “Eliminar” y seleccionar 50% gris. Estas acciones harán que los bloques tengan el tamaño requerido y se resalten en un color diferente al del fondo principal.
Debería verse así:
Ahora simplemente seleccionamos el borrador y usamos la función "borrador mágico" para hacer clic en cada bloque gris y obtener una plantilla con recortes. El siguiente paso es seleccionar nuestra imagen principal y colocarla debajo del fondo y obtener imágenes ya preparadas en las que escribir texto con el nombre del menú u otros elementos publicitarios.
Excelente. Después de haber colocado una imagen de nuestro diseño, solo tenemos que seleccionar “guardar para Web” y como resultado obtenemos 2 de nuestras imágenes. Ahora volvemos a nuestro grupo y podemos completar el avatar principal (vertical). Usaremos el banner para el menú un poco más adelante cuando trabajemos con el código de marcado wiki.
Creemos el menú en sí, con elementos activos que redirigirán al usuario a las secciones necesarias de un sitio de terceros o a álbumes y catálogos del propio grupo. Usaremos una nueva imagen para variar -))).
Entonces, volvamos a Photoshop y creemos un nuevo lienzo con unas dimensiones de 400x300 píxeles. Luego seleccione en la sección: lugar de archivo y seleccione una imagen para el fondo del menú.
Colocamos los botones de nuestro menú futuro sobre la imagen y cortamos la imagen como hicimos arriba seleccionando los bloques necesarios. Luego seleccionamos también “guardar para web” y nos sale una carpeta con nuestros cortes. En mi caso, tengo 4 fotografías en una carpeta separada.
Ahora necesitamos cargar las imágenes descargadas de Photoshop en un álbum separado y ocultarlas de miradas indiscretas. Después de cargar, cada imagen recibirá su nuevo nombre y su identificación única.
Tenga en cuenta que debe tener:
- Los materiales se abren en modo “restringido”;
- Se incluyeron debates;
- La carpeta con fotos está abierta a todos.
Ahora solo queda configurar nuestra página donde se mostrará el menú. Para hacer esto, vaya a la página principal de la comunidad y seleccione materiales nuevos, edítelos y llame a "NUESTRO MENÚ".
A continuación, debemos insertar las imágenes que recibimos al cortar en Photoshop. Algunas personas usan códigos de marcado, pero para no pensar demasiado, le sugiero que simplemente seleccione insertar una imagen haciendo clic en el ícono de la cámara y cargue una tras otra.
Trabajando en un editor de texto, si después de cargar las imágenes, hacemos clic en el icono en forma de corchetes en la esquina superior derecha, deberíamos ver este código:
Consejo: Un punto importante después de cargar imágenes es quitar el relleno. Esto se puede solucionar insertando "nopadding" antes de los tamaños de imagen.
Para aclarar, debajo está escrito qué viene de dónde, pero teniendo en cuenta que todo se insertará automáticamente y no hay que ser inteligente, y lo abriremos mientras algunos escriben cada imagen y toman la identificación, entonces simplemente descargamos y guardamos.
[]
donde xxxxx es la identificación de tu imagen
yyyyy - ancho en píxeles (máximo 388)
Debería terminar luciendo así:
Ahora nuestras imágenes están recogidas en un banner separado. Y para agregar un enlace a cada elemento, simplemente haga clic en la imagen con el marcado deshabilitado y en la sección de enlaces pegue la URL copiada.
Y ahora llegamos al punto final y más importante en la creación de nuestro menú VKontakte. Ahora necesitamos guardar nuestra página con imágenes y copiar su dirección. En mi caso se ve así:
http://vk.com/page-116682062_51411604?act=edit&hid=183950676§ion=edit
Recuerde, al principio del artículo creamos un menú auxiliar, que será una continuación de nuestro avatar principal, y le hicimos una plantilla. Esto es exactamente lo que necesitamos ahora.
Vaya a la página principal y haga lo siguiente:
Paso #1.
Pegamos la dirección de la página en el campo de texto para una nueva publicación en el muro, después de lo cual se convertirá en un enlace.
Paso #2.
Adjuntamos una imagen de nuestro marcador de posición de menú a la publicación y hacemos clic en enviar.
Paso #3.
Ahora, después de publicar la publicación, haga clic en la hora de creación en la parte inferior izquierda de la publicación y seleccione “PIN”.
¡¡¡Excelente!!! Terminemos aquí. Ahora ya sabes cómo crear menús interesantes y puedes ganar mucho dinero con ello. Te aconsejo que hagas todo en el siguiente orden:
- Ideamos una estructura y ordenamos el diseño de las imágenes del menú;
- Cambiamos el tamaño y cortamos todas las imágenes;
- Insertar imágenes en álbumes;
- Editamos todos los cortes en el editor y los publicamos en las páginas principales del grupo.
Como resultado de nuestro trabajo, obtendremos este menú.
Pero el menú en sí, al hacer clic, aparecerá con enlaces activos. Vale la pena jugar con los tamaños y ajustarlos para que se ajusten a tu pantalla, pero no te olvides de la visualización en dispositivos móviles.
IMPORTANTE: Después de cambiar el diseño de VK en 2016, se realizaron nuevos cambios al crear imágenes y requisitos para las imágenes.
Descargue la plantilla de menú grupal VK + todas las fuentes de lecciones
Espero que el material te haya resultado útil y que ahora comprendas fácilmente cómo crear un hermoso menú para un grupo de VKontakte. Suscríbete a las actualizaciones del blog y nos vemos pronto en nuevas publicaciones. Si tienes alguna pregunta, escríbela en los comentarios y definitivamente te ayudaré.
Adjunto vídeo para reforzar lo leído -))).
Entonces, para crear un menú abierto, necesitamos una imagen que desempeñe el papel de un menú abierto. Las imágenes que agregamos en el artículo sobre cómo crear un menú gráfico no funcionarán, ya que necesita una imagen del menú ampliado y no cada elemento individualmente. Además, puedes utilizar absolutamente cualquier imagen que indique que oculta el menú del grupo. Por ejemplo, una imagen con el título: "Menú de grupo". O algo así.
Después de haber seleccionado la imagen que usaremos. Además, el tamaño de la imagen puede ser casi cualquiera y se puede cargar en un álbum de fotos. (UPD: Esta no es información del todo precisa. Puede leer con mayor precisión sobre los tamaños en el comentario a continuación. Para hacer esto, simplemente haga clic en el enlace: /otkrytoe-menyu-gruppy-vkontakte/#comment-7633)
Vayamos al grupo VKontakte. Y haga clic derecho para abrir el menú, si ya ha sido creado, en una nueva pestaña.
Después de esto, en la página del menú, debe hacer clic en el enlace "Editar".
Pero no es necesario cambiar el código. Simplemente haga clic en el enlace "Volver a la página". Esto es necesario para recibir un enlace a la página del menú.
Ahora que volvemos a la página del menú. En la barra de direcciones veremos un enlace a esta página, sin varios añadidos a la dirección. En otras palabras, un enlace limpio. Eso es lo que necesitamos.
Dejamos abierta esta página y volvemos al grupo VKontakte. Aquí necesitamos crear un registro al que agregamos una imagen que desempeñará el papel de abierto. Para hacer esto, seleccione "adjuntar foto" a continuación. Y seleccione una imagen del álbum o cárguela desde su computadora.
Una vez que se agrega una imagen a una publicación, no la publicamos todavía.
Y volvemos a la página del menú y copiamos la dirección de la página del menú del grupo VKontakte de la barra de direcciones. Y pegamos la dirección del menú copiada en la entrada que aún no hemos guardado. El resultado final debería verse así:
Después de agregar el enlace, el nombre de la página y su dirección aparecieron debajo. Una vez que la página aparezca en la parte inferior, podemos eliminar el enlace que acabamos de insertar en la publicación. Después de eso, haga clic en el botón "Enviar". Así, publicamos nuestra publicación en el muro del grupo.
Ahora haga clic en la fecha de la noticia.
Después de eso, cierre la entrada y actualice la página del grupo VKontakte. Ahora, en la parte superior, si todo se hace correctamente, tendrá una imagen de menú que desempeña el papel de un menú abierto de VKontakte. Sin embargo, los enlaces en el menú están inactivos. Y un enlace a esta entrada está activo.
Ahora, cuando el usuario esté en nuestro grupo, verá una imitación del menú. Y después de hacer clic en el menú abierto del grupo VKontakte, aparecerá el menú en sí, que funcionará como debería.
Desafortunadamente, no conozco otras formas de abrir un menú de contactos. Pero aún así, esta opción es mucho mejor que simplemente un enlace para abrir el menú completo.
Espero que este artículo te ayude a descubrir cómo crear un menú VKontakte abierto. Y eso es todo para mí.
Puedes ver cómo se ve el menú de grupo abierto en mi grupo.
