Cómo hacer que un botón se abra en una nueva ventana en Blogger

chuster · 27 Mar 2018

Hola, estoy creado mi web, he añadido unos botones que se adecuan perfectamente a lo que buscaba pero el problema que me ha surgido es que no tengo grandes conocimientos en html y css por lo que recurro aquí. He estado investigando algo pero no doy con la clave, a ver si por aquí me pudierais ayudar y así también a otras personas que tengas el mismo problema.

La cuestión es que me gustaría que el botón se abriera en una nueva ventana, he estado leyendo que hay que añadir tarjet black pero no sé dónde correspondería, uso blogger. Dejo por aquí los códigos utilizados para dichos botones y a ver cómo se podría solventar. Muchisimas gracias de antemano.

HTML:

<button class="button" onclick="location.href='URL';" style="vertical-align: middle;"><span>TEXTO</span></button>

CSS UTILIZADO EN LA PLANTILLA

Insertar CODE, HTML o PHP:

.button {
    position: relative;
    background-color: #86B74D;
    border: none;
    border-bottom: 2px solid #001f3f;
    font-size: 15px;
    color: #FFFFFF;
    padding: 15px;
    width: 170px;
    transition-duration: 0.4s;
    text-decoration: none;
    overflow: hidden;
    cursor: pointer;
margin:10px;
}
.button:after {
    content: "";
    background: #86B74D;
    display: block;
    position: absolute;
    padding-top: 300%;
    padding-left: 350%;
    margin-left: -20px !important;
    margin-top: -120%;
    opacity: 0;
    transition: all 0.8s
}
.button:active:after {
    padding: 0;
    margin: 0;
    opacity: 1;
    transition: 0s
}
.button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}
.button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}
.button:hover span {
  padding-right: 25px;
}
.button:hover span:after {
  opacity: 1;
  right: 0;
}

Line · 27 Mar 2018

Remplaza:

HTML:

<button class="button" onclick="location.href='URL';" style="vertical-align: middle;"><span>TEXTO</span></button>

Con:

HTML:

<a class="button" onclick="location.href='URL';" style="vertical-align: middle;" target="_blank"><span>TEXTO</span></a>

- - - Actualizado - - -

Sino puedes poner el boton así:

HTML:

<button class="button" onclick="window.open('URL','_blank'))" style="vertical-align: middle;"><span>TEXTO</span></button>

chuster · 28 Mar 2018

Perfecto Line, funciona a la perfección cómo quería. Te lo agradezco muchísimo.

Otra cosillas que no caí en el momento de crear el post es éstos botones cuenta como un enlace normal no?
Me refiero por el tema de que cómo la mayoría son enlaces de referido, los tenía configurado como nofollow, no tiene importancia o también se podría agregar al enlace?

Muchas gracias de nuevo.

Un saludo.

Cómo hacer que un botón se abra en una nueva ventana en Blogger

chuster Seguir

Line

chuster