Tutorial: CMS - Como crear un diseño y aplicarlo.

1. Desplegar el menú de vBulletin CMS en el panel de administración y elegir Administrador de Secciones.
   Ver el archivo adjunto 1959
2. En una instalación sin contenido de ejemplo, solo veremos una sección llamada Home. Podemos renombrarla si gustan, lo que haremos aquí es crear una sección dentro de la existente, Home. Nombraremos la sección como Noticias. Le damos al botón Agregar Nueva Sección, superior derecho.
   Ver el archivo adjunto 1960

1. Del menú vBulletin CMS, elegimos Administrador de Grids.
2. Aquí van a ver un solo grid llamado 3 Column Fixed-Liquid-Fixed, si ustedes instalaron contenido de ejemplo van a tener más grids, pero haré de cuenta que no. Le damos al botón Crear un Nuevo Grid.
3. Lo nombramos Contenido + Columna lateral 250px, con las siguientes opciones
   Ver el archivo adjunto 1961

1. Antes de pasar a crear nuestro diseño, hace falta crear algunos widgets para la barra lateral. Vayamos a la opción Widgets.
2. Vamos a crear tres widgets, uno para los mensajes recientes del foro, uno para un widget usando html, y otro para encuestas recientes.
   • Mensajes Recientes: le damos a Crear Nuevo Widget. Lo nombramos Mensajes Recientes y elegimos Busqueda General, de tipo de widget y le damos a Guardar.
     • Le damos al enlace configurar que esta junto a nuestro widget, y de las opciones que aparecen solo vamos a elegir: Post (Mensajes) y le damos a Guardar.
   • Widget HTML: creamos un nuevo widget y esta vez elegimos HTML Estático, y lo nombramos Reloj, o el nombre de el widget que ustedes vayan a poner y le damos al botón Guardar.
     • Ahora vamos a configurar este nuevo widget. En el formulario pegamos el código HTML del widget que deseen poner, como ejemplo les dejo este código que yo usaré
       
       Insertar CODE, HTML o PHP:

       <script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script>if (WIDGETBOX) WIDGETBOX.renderWidget('40f213de-e4d2-4ce1-92a0-bab6f6b09603');</script><noscript>Get the <a href="http://www.widgetbox.com/widget/showtimeapp">Show Time App</a> widget and many other <a href="http://www.widgetbox.com/">great free widgets</a> at <a href="http://www.widgetbox.com">Widgetbox</a>! Not seeing a widget? (<a href="http://docs.widgetbox.com/using-widgets/installing-widgets/why-cant-i-see-my-widget/">More info</a>)</noscript>

   • Encuestas Recientes: vayamos una vez más a crear un nuevo widget y elegimos como tipo de widget, Encuesta y lo nombran Encuestas Recientes y le damos al bóton Guardar.
     • Vayamos al link Configurar de nuestro nuevo widget y elegimos el total de encuestas a mostrar, y que el tiempo límite de antiguedad a mostrar encuestas. Yo elegí 1 encuesta, de los últimos 365 días
     Este es el resultado final:
     Ver el archivo adjunto 1962
     

1. Ahora necesitamos crear nuestro diseño. Vayamos a la opción Administrador de Diseños. Vamos a ver un diseño ahí, es el que está usando el CMS actualmente. Necesitamos crear uno usando nuestro grid que creamos anteriormente.
2. Le damos al botón Crear un Nuevo Diseño.
   Título: Lo que deseen.. va ser para su CMS principal y ademas para la sección noticias. Yo lo nombré Diseño Predeterminado, ya que será el que usare en la página principal del CMS incluyendo la categoría Noticias.
   Cuadrícual (aka Grid (H)): aquí elegimos nuestro grid que creamos anteriormente, Contenido + Columna Lateral 240px.
3. Arrastremos el recuadro rojo llamado Contenido Primario al cuadro de la derecha. Luego seleccionemos Menú desde Widgets, y presionamos el botón [>] Arrastremos ese widget a la columna lateral izquierda. Hagamos lo mismo para el widget Mensajes recientes, Reloj, y Encuestas. Este es el resultado final:
   Ver el archivo adjunto 1963

1. Vayamos a nuestro CMS, si.. esto no se hace en el panel de administración. Pasamos el puntero por ensima del título HOME y verán un icono en forma de lapiz. Le hacemos clic para editar la sección principal.
   Ver el archivo adjunto 1965
2. Ahora solo necesitamos cambiar la opción Diseño de Sección, y elegimos nuestro diseño, Diseño Predeterminado y le damos al boton de arriba, Guardar.
3. Hagamos exactamente lo mismo para la sección Noticias. Yendo primero a dicha sección y luego haciendo clic en en icono en forma de lapiz y cambiamos al mismo diseño y volvemos a guardar.
   Ver el archivo adjunto 1968
   
   Mientras estamos en las opciones de editar la sección, podemos cambiar varias opciones también. Yo he cambiado la opción de publicación a Publicado, así cada artículo o noticia que haga en esa sección va a ser publicada y no apareceran los típicos errores de no permisos a los usuarios. Ademas he cambiado la opción Columnas de Contenido a 2 Columnas. Así mi contenido aparecera en dos columtas, ver screen abajo.

<div class="cms_widget">            
<div class="block">
        <!--  Widget Header -->
        <div class="cms_widget_header">
            <h3>La Hora</h3>
        </div>
        <div class="cms_widget_content">
            <div class="cms_widget_post_bit">
        
<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script>if (WIDGETBOX) WIDGETBOX.renderWidget('40f213de-e4d2-4ce1-92a0-bab6f6b09603');</script><noscript>Get the <a href="http://www.widgetbox.com/widget/showtimeapp">Show Time App</a> widget and many other <a href="http://www.widgetbox.com/">great free widgets</a> at <a href="http://www.widgetbox.com">Widgetbox</a>! Not seeing a widget? (<a href="http://docs.widgetbox.com/using-widgets/installing-widgets/why-cant-i-see-my-widget/">More info</a>)</noscript>
            </div>
            </div></div>
            </div>

Clumsy dijo:

Hola Elmer,

yo (creo) no tengo CMS, acabo de instalar (vBulletin 4.0.0 Beta 5

) pero me gustaría tener una columna en la que poder poner enlaces de interés...

Hacer clic para expandir...

bcilloniz dijo:

Justo lo que buscaba... pero una preguntita general:

¿Es posible plasmar cualquier diseño, o existen limitaciones?

Saludos y muchas gracias por tus aportes.

Hacer clic para expandir...

sienteasturias dijo:

Por otra parte tengo una duda, es posible o seria posible sacar ahi en el CMS por ejemplo algun post de alguna categoria del foro en concreto?

Hacer clic para expandir...