Bridge Theme: Tutorial a fondo de la plantilla de WordPress

Cuando necesitamos montar una página web, a todos nos ha venido a la cabeza la misma duda: ¿cuál es la mejor plantilla que debo utilizar en WordPress?

Pues bien, hoy vengo con un tutorial de una de las favoritas y elección de muchos a la hora de montar la web: Bridge Theme.

Lo primero que haré será explicarte qué es la plantilla de Bridge y cuáles son sus características, y más adelante te enseñaré cómo configurar Bridge paso a paso con un vídeo tutorial para que no te pierdas en ningún momento.

CTT: Tutorial a fondo de la plantilla Bridge, una de las opciones favoritas para WordPress. ¡No te lo pierdas!

Además, mediré el rendimiento de esta plantilla con una demo sin plugins, y extraeré conclusiones de los pros y contras de utilizarla (sin pelos en la lengua) para que seas tú quien saque las conclusiones de si instalar la plantilla Bridge en tu WordPress u otra.

 

¿Qué es Bridge y qué características tiene este theme de WordPress?

Bridge Theme es una de las plantillas o temas de WordPress más populares que existen, y que nos permiten crear una página web de forma mucho más sencilla, que haciendo la web de forma manual sin una plantilla o tema previamente instalado, y sin necesidad de saber nada de código.

A día de hoy, se encuentra posicionado en el número 6 de los temas más vendidos de Themeforest, ya que es una buena opción para cualquier sitio web, ya sea una página corporativa, blog o tienda ecommerce.

La plantilla fue creada por Qode Themes y está entre los mejores temas para WordPress actualmente.

Por otro lado, trabaja por defecto con Visual Composer (WP Bakery), y la ventaja que tiene es que una vez compres la plantilla, ya te vendrá el plugin de este constructor en los documentos descargables.

Pero como no quiero que pienses que es de los mejores themes sin haberlo visto antes, voy a enseñarte el por qué de ello con este tutorial o manual de la plantilla Bridge Theme para WordPress.

 

Bridge demos

Como te he comentado, una plantilla como Bridge Theme nos permite crear la web sin saber código, pero además, tienes un montón de demos para incluir en tu página web y no tener que pensar el diseño, sino que lo adjuntas directamente y modificas sobre él.

En concreto, cuenta con 376 demos diferentes que puedes incluir en tus diseños. Además, hay algunas demos que son muy visuales y modernas, y que darán personalidad propia a tu web (como las que veis en la imagen siguiente).

plantilla bridge wordpress demos

 

Precio

La plantilla Bridge Theme de WordPress podrás encontrarla en Themeforest para comprarla por un precio de 59$ con 6 meses de soporte, las actualizaciones pertinentes y la garantía de calidad del propio proveedor de plantillas.

Además, existe una versión extensible que se le añaden 17,63$ a los 59$ anteriores, incluyendo soporte personalizado por 12 meses

 

Soporte

Dentro de la propia página de Qode, hay una plataforma para la gestión de los tickets, donde podrás enviar tus dudas y ellos en cuestión de unas 24 horas suelen solucionarlas.

Support bridge theme plantilla

Esto es una ventaja muy grande, porque puedes preguntar sobre cualquier tema relacionado con tu web, y en la gran mayoría de los casos te lo responderán de forma personalizada, siendo de gran ayuda tener este respaldo al configurar tu plantilla de Bridge.

 

Valoraciones

Bridge Theme es una de las plantillas más populares, junto con Divi, Avada, Jupiter, GeneratePress, Génesis y otros themes; pero además, la plantilla de Bridge está muy bien valorada, ya que el 86% de las valoraciones le han asignado 5 estrellas, muy por encima de otras plantillas, con una media de 4,77 de puntuación total.

bridge theme valoraciones

 

Cómo instalar Bridge Theme en WordPress paso a paso

Una vez visto lo anterior, llega el momento de aprender a instalar y configurar la plantilla de Bridge para WordPress desde cero y paso por paso en tu hosting, para que puedas ponerte a hacerlo tú y crear tu web.

Cuando hayas comprado la plantilla, y descargado todos los elementos, abre tu panel de WordPress y clica sobre “Apariencia” > “Temas”.

Una vez estás aquí dentro, ve a donde pone “Añadir Nuevo”, y clic sobre “Subir Tema”.

Aquí deberás adjuntar el archivo .ZIP que has descargado de tu compra con el nombre “Bridge”.

Ojo, en la carpeta te vendrán varias subcarpetas, donde encontrarás el propio theme, el child theme, la licencia y otro tipo de documentación. Selecciona el archivo Bridge.zip para su instalación.

Una vez lo tengas, lo instalas y activas.

Verás que se te han activado nuevas opciones en el panel como Qode slider, qode carousel, qode options y qode import. Esto significa que ya tienes Bridge Theme instalado en tu WordPress.

Antes de ponerte a trabajar en la configuración general de la plantilla, tendrás que instalar el tema hijo de Bridge o bridge child theme, para que cuando modifiques la plantilla y actualices, no se te borren los cambios nuevos añadidos.

Por suerte para ti si no sabes código ni te manejas en WordPress, Qode ya ha pensado en esto, y te lo facilita en las carpetas que te has descargado junto con la licencia, con el nombre de Bridge-child.zip.

bridge child wordpress

Ahora tendrás que volver a realizar el mismo proceso de antes, subir este archivo a los temas y activarlo:

  1. Apariencia > Temas
  2. Añadir Nuevo > Subir Tema
  3. Adjuntar el archivo Bridge-child.zip
  4. Instalar y activar

¡Ya tendrás la instalación completada!

 

Configuración general de la plantilla Bridge Theme para WordPress

Lo primero que voy a enseñarte es a elegir la plantilla de las demos de Bridge para que puedas añadirla en tu WordPress y modificar sobre ella, y así no calentarte la cabeza en un nuevo diseño.

Ve a “Qode import” del panel de WordPress, y donde pone “Demo – Original” pulsa y selecciona la demo que más te guste (podrás ver todas las disponibles aquí). 

Una vez lo tengas, importa el contenido completo con las imágenes de la plantilla (para ver mejor el resultado) y clica sobre “importar”.

instalar bridge wordpress

Una vez completada, irás a las páginas para ver si está todo correcto y tienes creada tu página web como en la plantilla.

Si es así, y ya te aparece tu página de inicio, blog, contacto, etc. ¡Ya tendrás tu plantilla escogida y lista para configurar!

Para configurar las opciones de la plantilla, tendrás que ir a la sección del panel de WordPress de “Qode options” y empezar a configurar paso a paso cada una de las pestañas de la página web.

configurar plantilla bridge wordpress

Pero no te voy a explicar paso a paso cada una de las pestañas, sino que voy a ir a las más importantes: logo, fonts, elements y blog.

 

Logotipo

Para subir el logotipo y cambiar el que viene por defecto, irás a la pestaña de “Logo”, y seleccionarás el que quieras como logotipo principal, logotipo para el sticky, es decir, para cuando los usuarios bajen hacia abajo y hagan scroll, les siga apareciendo tu logotipo arriba; y el favicon.

bridge themeforest plantilla

Lo bueno y que más me gusta de esta sección es que puedes elegir incluso doble logotipo, uno para ordenador y otro para móviles, y así elegir en función del tipo de usuario (mobile VS. desktop), algo que puede mejorar mucho su experiencia en el caso de que el logotipo sea muy grande.

Por otro lado, puedes predefinir los píxeles que va a tener el logo tanto en móvil como en ordenador, y así que aparezca en el tamaño exacto que estás buscando.

 

Fonts

Este es un punto fundamental en el que tendrás que seleccionar los tamaños que quieras darle a tus títulos y textos, tanto en ordenador, como en tablet y móvil.

Tema wordpress bridge configuracion

Esta parte del tema también me gusta mucho, ya que es muy visual y muy claro de ver y asignar el tamaño en el que quieras que se vean cada uno de los textos de la web.

Además, aquí definirás también el estilo de las tipografías, textos del menú y cabeceras de las páginas, así como del footer, portfolio y breadcrumbs (migas de pan).

 

Elements

En elements definirás los estilos de los elementos principales de la web como son: separadores, botones, blockquotes, iconos de redes sociales, testimonios, contadores, etc.

tutorial bridge wordpress

Como ves en la imagen, aparecen tanto los colores de cada botón, los tamaños, bordes, fuentes del texto, etc.; y podrás hacer lo mismo con cada elemento de Bridge (blockquotes, testimonios, etc.).

 

Blog

Para configurar el blog en la plantilla de Bridge Theme, deberás ir a la pestaña de “Blog”, y empezar a personalizar las opciones que trae por defecto la plantilla demo que has insertado.

manual bridge wordpress

Lo más importante de este apartado es el estilo del blog, ya que en la sección de “Archive and category layout” tienes un montón de opciones para el estilo del blog: largo, en cajas, en fotografías, etc.

Esto da mucha personalidad a los blogs, ya que puedes tener diseños de formas totalmente diferentes a lo que estamos acostumbrados, y es algo mucho más avanzado que otras plantillas, que para configurar estos estilos deberán de hacerse a código.

Por otro lado, en esta sección activarás o desactivarás las paginaciones, le dirás cuántas palabras quieres que se muestre en los resúmenes de los posts y le darás estilo al blog con los colores y tipografías.

 

Rendimiento de la plantilla Bridge Theme

Para saber el rendimiento de la plantilla de Bridge, se ha realizado el test con las herramientas Pingdom y GTmetrix para la página web con la plantilla demo (demo número 68) sin optimizar, en un hosting SSD inicio de Raiola, sin ningún plugin de caché y sin ningún plugin activo ni instalado que pueda afectar a la velocidad de carga, para tener una estimación inicial.

Este es el resultado de la página en Pingdom:

rendimiento bridge wordpress

Y este el resultado de GTmetrix:

Bridge Theme: Tutorial a fondo de la plantilla de WordPress 1

A simple vista se puede ver como la página en sí es ligera y fácil de optimizar, por lo que no será muy complicado llegar a una buena nota en el performance grade, así como en el PageSpeed y el YSlow, además de realizar una mejora en los tiempos de carga.

Además, hay que tener en cuenta que está alojado en un servidor acorde a las necesidades de esta página y de buen rendimiento, una ventaja de cara a la optimización de la página web, ya que el servidor puede ser un gran impedimento a la hora de utilizar este tipo de plantillas.

Por todo esto, la plantilla tendrá un buen rendimiento si procedemos a optimizarla.

 

Review: Pros y Contras de la plantilla Bridge

Para concluir este tutorial o manual de la plantilla Bridge de WordPress, voy a hacerte un review de los pros y los contras que tiene esta plantilla para que te decidas si utilizarla o no en tu WordPress.

✅ PROS de la plantilla de Bridge Theme:

  • Es una plantilla con un precio muy asequible comparado con otras como Divi, que tienen un precio mayor.
  • Incluye Visual Composer (WP Bakery) junto con la compra de la plantilla, por lo que no tendrás que buscar el constructor por separado y tenerlo que volver a comprar (a no ser que quieras utilizar el forntend editor de Visual Composer, que entonces sí que tendrás que hacer un upgrade).
  • La plantilla cuenta con 376 demos muy distintas y 24 layouts concepts para que puedas incluir en tu web y diseñar en base a ellas, quedando una web muy estética visualmente y limpia.
  • Opción de personalización del blog muy completa y con facilidad de crear un blog muy atractivo visualmente, así como opciones muy minimalistas fuera de lo común.
  • La plantilla tiene multitud de opciones de personalización y es muy flexible a la hora de configurar cada uno de los apartados.
  • Bridge es un theme optimizado y amigable para SEO, por lo que si trabajas bien tus contenidos, la plantilla no será un impedimento a la hora de posicionar.
  • Una ventaja muy importante es el soporte personalizado, ya que para cualquier pregunta o problema que tengas, podrás acudir a que te ayuden en sus tickets de soporte.
  • Como se ha visto, es una plantilla con un buen rendimiento y no es complicada de optimizar, por lo que podrás llegar a puntuaciones muy buenas de cara a Google y una velocidad de carga muy competitiva.

❌ CONTRAS de la plantilla de Bridge Theme:

  • El panel de personalización de la plantilla tiene demasiadas opciones comparado con otras, que son más intuitivas y fáciles de configurar.
  • La curva de aprendizaje es más elevada que con otras plantillas, por lo que es más compleja para personas que se estén iniciando en el mundo de wordpress.
  • Solo puedes adquirir la plantilla desde Themeforest, y si no te gusta y quieres devolverla, te reembolsarán el dinero a través de su plataforma para que lo utilices en su página web.

 

¿Es Bridge una buena opción como plantilla para mi página web en WordPress?

Si después de todo lo que te he contado aún no te has decidido, Bridge Theme+Visual Composer es una buena opción para tu página web, pero no mi favorita.

Actualmente hay otros constructores que están cogiendole mucha ventaja a Visual Composer, como es el constructor de Divi, Thrive Architect o Elementor.

Aunque Bridge podemos combinarlo con otro constructor como Elementor, no dará el mismo rendimiento que con su constructor base, por lo que mi consejo es que elijas esta combinación o pases a utilizar otra plantilla y otro constructor.

Aun así, hay opiniones para todo, así que nos encantaría saber la tuya…

¿Crees que Bridge Theme es una buena opción como plantilla para una web?

¿Cuál es tu combinación favorita de plantilla+constructor?

Share on twitter
Compartir en Twitter
Share on facebook
Compartir en Facebook
Share on pinterest
Compartir en Pinterest

¿Te gusta el blog?

Apúntate al boletín y te enviaremos los mejores artículos una vez al mes.

¿Te ayudamos?

Escríbenos si tienes dudas o necesitas una solución específica. Nuestros expertos te ayudarán en todo lo posible.

Sé el primero en enterarte de ofertas, sorteos y novedades.

Tenemos 43 comentarios en

"Bridge Theme: Tutorial a fondo de la plantilla de WordPress"

43 respuestas

  1. Buenas Bego, nos ha servido mucho tu explicación. Ya que es un tema bastante complicado… pero ahora no sabemos cómo proceder…
    Nos gustaría saber alguna forma de gestionarlo más fácilmente.. Podrías ayudarnos? Muchas gracias!!

    1. Hola Nadia,

      Al final todo es empezar con un buen hosting, instalar el WordPress y empezar a configurar tu plantilla. Si quieres decirme alguna duda más concreta estaré encantada de ayudarte!

      Saludos,
      Bego

  2. Buenas tardes Bego,
    Perdona por mi gramática pero soy extranjero y no domino demasiado tu idioma, pero tengo un lío con la actualización algunos archivos de woocommerce de la plantilla Bridge version 16.8 ,mi hosting tengo con webempresa, no se como actualizar estos archivos, estoy bastante verde en esta materia, tengo antes actualizar mi Tema Bridge?, me podrias ayudar con esto por favor ?

    1. Hola, Sebastian: Es un caso bastante concreto y hay que verlo con cuidado para no generar ningún problema. Lo mejor es que contactes con un profesional que pueda ayudarte. Si quieres enviarnos un correo a nosotros, tenemos un equipo de Soporte WordPress especializado. El email de contacto es info@raiolanetworks.es ¡Un saludo!

  3. Muchas gracias por el artículo, muy completo. Quisiera saber cómo puedo previsualizar las fuentes incluidas en la plantilla de una manera cómoda, es decir, sin tener que asignar una en concreto, guardar y actualizar página para ver cómo luce. Sino, ¿cómo consigo la lista de fuentes para descargarlas y previsualizarlas en local en el ordenador? Saludos y gracias por tu tiempo. Mireia

    1. Hola Mireia, puedes utilizar WP Bakery en modo visual, y así verás los cambios inmediatos.
      Saludos y gracias por leer el post 😉

  4. Hola Bego, muchas gracias por tu tutorial.
    Tengo 2 dudas:
    1.- He creado mi web con este tema, pero en la versión de móvil se me queda muy pegado al slider de la página de inicio y en el resto de páginas se queda muy pegado al título de la página. Lo he intentado todo pero me resulta imposible. Podrías ayudarme?
    2.- Al principio de tu tutorial indicas que hay un soporte en la página Qode, pero no localizo esta opción.
    Muchas gracias por tu atención.

    1. Hola Javier, la verdad es que lo que me comentas no lo entiendo bien, pero supongo que se te quedan pegados los elementos. Para ello tendrás que añadir un margen o padding a cada sección.
      Aquí tienes la página de soporte para Bridge: https://qode.ticksy.com/
      Saludos!

  5. Hola Bego, estoy bastante decidido a instalar Bridge pero tengo algunas dudas. La primera es que en mi web es imprescindible que el acceso a sus contenidos sea restringido. ¿Tiene esta opción o algún pluguin de «acceso exclusivo a clientes»? También querría saber si es posible la importación masiva de todas las imágenes que necesito para trabajar en la web. Muchas gracias por tu ayuda

    1. Hola David, esto es algo externo a la plantilla, ya que para crear una cuenta privada para tus clientes podrás utilizar algún plugin a parte. Podrás subir todas las imágenes de tu web a través de los archivos internos o bien subiéndolas de golpe en los Medios.

  6. Buenas Bego, creo que ya va siendo hora de cambiar mi plantilla de wordpress, y ésta es una muy buena oportunidad, al día de hoy sigo utilizando una plantilla «gratuita», así a lo loco, vamos a darle un poco de seriedad al asunto ¿No te parece? voy a echarle un vistazo más a fondo y a ver si me decido por alguna opción, me parece una plantilla con muchas opciones, ¡Vamos a por ello! Gracias por el post Bego. Saludos! 🙂

    1. Me parece una buena decisión Manu. Bridge es una muy buena opción, pero a nivel personal, me quedo con GeneratePress+Elementor, pero esto es también con lo que más cómodo te sientas. Ya me contarás cuál es tu decisión final. Un abrazo 😉

  7. Buenos días!
    He utilizado este tema para crear una Web. Parecía que todo iba bien y adaptada a todos los dispositivos.
    Cuando la he colgado, al verla en el móvil me aparece diferente, en vez de los botones aparece el código, no aparece la cabecera… muy diferente todo….
    Cuando voy al final de la página aparece: «Vista Completa», le doy y ya me aparece la página normal. ¿Tengo algo mal en la configuración? No entiendooo.
    Muchas gracias

  8. Hola Bego
    Gracias por este post tan profundo. Tengo la plantilla y me gustaría hacer dos cambios y no sé cómo.
    1. En las categorías ampliar el texto mostrado de cada entrada que e sbastante corto por defecto.
    2. Cambiar Read more por Leer más.
    Puedes ayudarme con esto? Aquí puedes ver lo que te digo https://modaenlana.com/cate
    Gracias y saludos

    1. Hola Mario,

      1. Puedes ampliar el texto dentro de los Qode Options en las fuentes. Sino también puedes hacerlo con CSS seleccionando ese único módulo de posts.
      2. Para cambiar el Read More puedes utilizar Poedit y editar los archivos .mo y .po.

      Espero haberte ayudado! Un saludo 😉

  9. Hola soy de chile, recién entré al mundo de WordPress.. estoy en theme bridge pero tengo dudas de cómo cambiar las fotos … me puedes ayudar ??
    Hay muchas cosas q aun no entiendo mucho .
    Vmartinez@cosl.cl
    +56933792252

    1. Hola, Vicky:

      ¿Qué fotos necesitas cambiar?

      En el caso de que te refieras a las de las páginas de la demo de Bridge, sencillamente entra a ellas desde el Dashboard de WordPress y usa la opción «editar».

      Un saludo.

    1. Hola Vicky, probablemente tengas el menú activado a un lado. Prueba a cambiar el template o a cambiar el estilo del menú.
      Un saludo!

  10. Hola Bego, gracias por el tutorial. Yo tengo instalada Bridge desde hace un año y ahora no me aparece WP Bakery como antes, puede ser que me haya caducado la plantilla? ¿Sabes si tengo que renovarla anualmente? MIl gracias de antemano

    1. Hola Veronica, la plantilla no necesitas renovarla, puesto que el precio de 59$ incluye las actualizaciones. Lo que sí deberías de renovar es WP Bakery, ya no solo por usabilidad tuya, sino también por seguridad de la propia web. ¡Un saludo!

  11. Hola, podrías ayudarme? quiero dejar el menú fijo y no logro averiguar dónde para escritorio, sí para móvil. Muchas gracias

  12. Hola Bego! Llevo más de un año con Bridge y he realizado páginas con ella, al momento sin problema, pero ahora que intento hacer una nueva me dice que debo registrar mi cuenta de bridge, y al hacerlo con los datos del «Purchase Code» y correo personal con la cual la compré en Themeforest, no me deja hacerlo, me aparece la leyenda de «Please wait» y ya de ahí no pasa. Es problema del servidor de cPanel de mi cliente o con mi tema? Mi temor es que entonces ya no podré hacer más sitios con Bridge, ojalá me puedas asesorar que ya ando lo que sigue de preocupado… Saludos! https://uploads.disquscdn.c

  13. Hola, me pueden ayudar? Tengo una pagina web, que diseño un programador, quiero modificar el area de paginas, pero pongo editar y me aparecer muchos codigos y texto, trato de modificar el texto y al momento de actualizar, no lo guarda. Estoy modificando la pagina ya que su diseño es muy complicado.

    1. Hola Teresa, ¿estás modificando el visual o el HTML? Aún así es complicado guiarte sin ver desde dentro lo que está pasando.

  14. A ver si me podeis ayudar. Justo hoy he comprado la plantilla bridge. Je instalado la ultima versión de wamp, la ultima de WordPress… Instalo el tema y todo perfecto, pero cuando le doy a «activar» el tema para que se cargue y pueda empezar a trabajar con el, salta la típica pantalla de que no se ha encontrado la web…. ¿Puede ser por que ese tema no sea compatible con la ultima versión de wordpress? He mandado un mail a soporte de themeforest…. Pero ya veremos….
    Muchas gracias de antemano

    1. Hola Javi,

      la típica pantalla, ¿es un error 404 u otro?, ¿se da al acceder al home y al panel o solo a la primera?

      Sin más detalles te recomiendo a ciegas, pero revisa que en «Apariencia -> Personalizar» tengas correctamente establecida una página de inicio que exista y que en «Ajustes -> Generales» la URL que tengas establecida tanto como página de inicio como de página del blog sea correcta.

      ¡Un saludo!

  15. Hola.
    Soy nuevo en la creación de páginas y en WordPress y tengo una duda, ¿si compro Bridge lo puedo usar en varias páginas web / dominios?

  16. Hola Bego soy emprendedor de marketing digital y no me da nada de miedo aventarme a la aventura digital y ofrecer páginas web, relmente es asombroso las nuevas herramientas digitales y tu contenido y opinión es muy relevante! me gustaría que me ayudaras a consejos prácticos en mi página web de una clienta de un Salon de Manicure!

    1. Hola Alejandro, lo mejor es que trates de hacer el diseño centrándote en el tipo de audiencia de este salón y pensando en cómo captarlos y convertirlos en clientes. Muchas gracias por tus palabras!!

  17. Bego Gracias por los datos aportados. Que plantilla me recomiendas para un centro medico? donde se manejen turnos online, historias clínicas del paciente, entre otras cosas propias de la salud?

    1. Hola Fermin, en la propia web de Bridge tienes un montón de plantillas, puedes utilizar la que más te guste. Aún así yo soy muy fan de Hello Elementor + Elementor o GeneratePress+Elementor. Un abrazo!

  18. Hola, ¿Es posible combinar distintos elementos de varias demos (plantillas) de Bridge dentro de una misma página? Gracias!

  19. Hola. He realizado los pasos pero en la barra lateral no aparece la pestaña de Qode Import.

    Lo estoy haciendo desde el servidor de raiola.

    Saludos.

  20. Buenas,
    Una pregunta hay forma de utilizar un codigo (Purchase code) del tema Bridge de una web que ya no existe para otra web?

  21. Buenas tardes.
    Al cambiar las fotos predefenidas en la plantilla bridge, por las mias con medidas similares, al cargar la página en la web salen todas recortadas. He cambiado de tamaños y siempre sucede ese recorte. No entiendo el porque??? Me podrían ayudar, por favor??? Gracias.

    1. Hola Miguel Angel, este tipo de cosas puedes consultarlas directamente con el desarrollador del plugin mediante soporte, al tratarse de una plantilla premium.

  22. Buenas tardes, está muy interesante, yo compré el tema y no puedo importar el demo porque el límite máximo de mi hosting es 128 mb, y se necesitan 256 mb…como se hace con eso para poder importar un demo?Gracias.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Utilizamos cookies propias y de terceros para obtener información estadística, mostrar publicidad personalizada a través del análisis de tu navegación, así como para interactuar en redes sociales. Si continúas navegando, consideramos que aceptas nuestra Política de cookies. ACEPTAR

Aviso de cookies