elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado:


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Formularios en Google Form Drive
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Formularios en Google Form Drive  (Leído 4,887 veces)
Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.830



Ver Perfil
Formularios en Google Form Drive
« en: 9 Agosto 2016, 00:36 am »

Holas, alguien que me de un cable con esto,  google form es una ***** como plantilla, asi que le quiero meter , algo responsive y mas atractivo,   


Tengo que  introducir 
Código:
<form action="https://docs.google.com/a/thelastart.com/forms/d/e/1FAIpQLSdtQcPqcl4ps8JJTmV6HaN4mVo_SItHfXSsKWoMXlZfZNwS3A/formResponse" method="POST" id="ss-form" target="_self" onsubmit=""><ol role="list" class="ss-question-list" style="padding-left: 0;">

Donde lo pongo, para que me respete el css??

Código:
<!DOCTYPE html><html class=''>
<head><script src='//assets.codepen.io/assets/editor/live/console_runner-d0a557e5cb67f9cd9bbb9673355c7e8e.js'></script><script src='//assets.codepen.io/assets/editor/live/events_runner-21174b4c7273cfddc124acb0876792e0.js'></script><script src='//assets.codepen.io/assets/editor/live/css_live_reload_init-7618a0de08795409d8f6c9ef6805f7b2.js'></script><meta charset='UTF-8'><meta name="robots" content="noindex"><link rel="canonical" href="http://codepen.io/markmurray/pen/JsAhx/" />

<link rel='stylesheet prefetch' href='//codepen.io/assets/reset/reset.css'>
<style class="cp-pen-styles">@import url(http://fonts.googleapis.com/css?family=Merriweather);
*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html, body {
  background: #f1f1f1;
  font-family: 'Merriweather', sans-serif;
  padding: 1em;
}

h1 {
  text-align: center;
  color: #a8a8a8;
  text-shadow: 1px 1px 0 white;
}

form {
  max-width: 600px;
  text-align: center;
  margin: 20px auto;
}
form input, form textarea {
  border: 0;
  outline: 0;
  padding: 1em;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  display: block;
  width: 100%;
  margin-top: 1em;
  font-family: 'Merriweather', sans-serif;
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  resize: none;
}
form input:focus, form textarea:focus {
  -moz-box-shadow: 0 0px 2px #e74c3c !important;
  -webkit-box-shadow: 0 0px 2px #e74c3c !important;
  box-shadow: 0 0px 2px #e74c3c !important;
}
form #input-submit {
  color: white;
  background: #e74c3c;
  cursor: pointer;
}
form #input-submit:hover {
  -moz-box-shadow: 0 1px 1px 1px rgba(170, 170, 170, 0.6);
  -webkit-box-shadow: 0 1px 1px 1px rgba(170, 170, 170, 0.6);
  box-shadow: 0 1px 1px 1px rgba(170, 170, 170, 0.6);
}
form textarea {
  height: 126px;
}

.half {
  float: left;
  width: 48%;
  margin-bottom: 1em;
}

.right {
  width: 50%;
}

.left {
  margin-right: 2%;
}

@media (max-width: 480px) {
  .half {
    width: 100%;
    float: none;
    margin-bottom: 0;
  }
}
/* Clearfix */
.cf:before,
.cf:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.cf:after {
  clear: both;
}
</style></head><body>
<h1>Elegant Contact Form</h1>
<form class="cf">
  <div class="half left cf">
    <input type="text" id="input-name" placeholder="Name">
    <input type="email" id="input-email" placeholder="Email address">
    <input type="text" id="input-subject" placeholder="Subject">
  </div>
  <div class="half right cf">
    <textarea name="message" type="text" id="input-message" placeholder="Message"></textarea>
  </div> 
  <input type="submit" value="Submit" id="input-submit">
</form>

</body></html>


En línea

https://www.latotatv.com
Código:
La Tota TV
[u]nsigned


Desconectado Desconectado

Mensajes: 2.376

Vue SSr


Ver Perfil WWW
Re: Formularios en Google Form Drive
« Respuesta #1 en: 9 Agosto 2016, 14:25 pm »

Hola, si entendí bien, los estilos los querés aplicar en el formulario de Google en su dominio? Porque eso no se puede, igualmente los nuevos formularios de Google usan Material Design



En línea

No hay atajo ante la duda, el misterio se hace aquí...
Se hace carne en cada uno, el misterio es existir!
Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.830



Ver Perfil
Re: Formularios en Google Form Drive
« Respuesta #2 en: 9 Agosto 2016, 15:17 pm »

Ajam!!,   ese es el problema, los nuevos formularios, no dejan hacer nada,  y la apariencia es fatal,   , si lo quiero hacer  responsive( tengo que meterlo al iframe) :¬¬,   eb fin arreglado esta,   pero  de seguro   me lo quitan en un tiempo

Código:
<form action="https://docs.google.com/a/thelastart.com/forms/d/e/1FAIpQLSdtQcPqcl4ps8JJTmV6HaN4mVo_SItHfXSsKWoMXlZfZNwS3A/formResponse" method="POST" id="ss-form" target="_self" onsubmit=""  class="cf">
  <div class="half left cf">
    <input type="text" id="input-name" placeholder="Name"  name="entry.1000000">
    <input type="email" id="input-email" placeholder="Email address"  name="entry.1000001">
    <input type="text" id="input-subject" placeholder="Subject" name="entry.1567048330">
  </div>
  <div class="half right cf">
    <textarea name="entry.1000003" type="text" id="input-message" placeholder="Message"  ></textarea>
  </div>  
  <input type="submit" value="Submit" id="input-submit"  name="submit">
</form>


 ;-)

Cuando me refiero a quitar, es que google a finales de agosto de manda abajo los ids de google host, asi es cuestion de tiempo, para que hagan lo mismo

Citar
Estimado administrador:

El año pasado anunciamos que dejaríamos de ofrecer alojamiento web en Google Drive para usuarios y programadores. El 31 de agosto de 2016, dejaremos de publicar contenido a través de googledrive.com/host/[id].

Según la información que tenemos, hay usuarios en tu organización que tienen páginas web alojadas en Drive. Hemos adjuntado un archivo CSV que contiene los elementos compartidos que se han publicado a través del alojamiento web de Drive en las últimas semanas.

Como alternativa al alojamiento web de Drive, te recomendamos dos opciones:

API de Drive: si estás utilizando la función de alojamiento web para proporcionar a los usuarios con sesión iniciada acceso a elementos de Drive públicos, puedes utilizar la API de Drive para este objetivo.
Alojamiento de Firebase: si estás utilizando la función de alojamiento web para proporcionar a los usuarios acceso a páginas web estáticas con contenido que está en Drive, puedes migrar a Firebase. Para realizar la migración, sube el contenido a Firebase y publica las páginas mediante las URL específicas de Firebase.
Si no haces cambios antes del 31 de agosto, los archivos que se hayan publicado con la función de alojamiento web no se cargarán.

Atentamente,
El equipo de Google Apps

« Última modificación: 9 Agosto 2016, 15:23 pm por Man-In-the-Middle » En línea

https://www.latotatv.com
Código:
La Tota TV
[u]nsigned


Desconectado Desconectado

Mensajes: 2.376

Vue SSr


Ver Perfil WWW
Re: Formularios en Google Form Drive
« Respuesta #3 en: 9 Agosto 2016, 15:35 pm »

Yo lo que me pregunto es por que usas Google Forms siendo la peor opción de todas xD
En línea

No hay atajo ante la duda, el misterio se hace aquí...
Se hace carne en cada uno, el misterio es existir!
Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.830



Ver Perfil
Re: Formularios en Google Form Drive
« Respuesta #4 en: 9 Agosto 2016, 16:33 pm »

por que trabajo todo  con Google apps, y  el nivel de seguridad es de lujo
En línea

https://www.latotatv.com
Código:
La Tota TV
WHK
CoAdmin
***
Desconectado Desconectado

Mensajes: 6.481


The Hacktivism is not a crime


Ver Perfil WWW
Re: Formularios en Google Form Drive
« Respuesta #5 en: 22 Agosto 2016, 02:25 am »

Bootstrap a ojos cerrados. Usa los CDN.

http://getbootstrap.com/css/
http://getbootstrap.com/components/

Acá el CDN: https://www.bootstrapcdn.com/

También te recomiendo Fonts awesome para vectorizar iconos, especiales para retina display:
http://fontawesome.io/
Acá el CDN: https://www.bootstrapcdn.com/fontawesome/

Y para hacerte la vida mas facil jQuery:
https://code.jquery.com/

Saludos.
« Última modificación: 22 Agosto 2016, 02:27 am por WHK » En línea

Telegram: @WHK102 - Semáforo Epidemiologico Chile
[u]nsigned


Desconectado Desconectado

Mensajes: 2.376

Vue SSr


Ver Perfil WWW
Re: Formularios en Google Form Drive
« Respuesta #6 en: 22 Agosto 2016, 18:43 pm »

@WHK el problema es que los nuevos formularios de Google no dejan editar el CSS
En línea

No hay atajo ante la duda, el misterio se hace aquí...
Se hace carne en cada uno, el misterio es existir!
WHK
CoAdmin
***
Desconectado Desconectado

Mensajes: 6.481


The Hacktivism is not a crime


Ver Perfil WWW
Re: Formularios en Google Form Drive
« Respuesta #7 en: 22 Agosto 2016, 18:53 pm »

Claro que si, en el panel de google script agregas un nuevo template html y le editas todo el css que quieras y luego cargas el template desde el script con HtmlService.createTemplateFromFile(...).evaluate()

De hecho las buenas prácticas es que separes el controlador de la vista, donde el archivo html es la vista donde van todos los css y js que necesites y el .gs con todo el contenido a modo de controlador donde simplemente llamas a la vista y le pasas variables, luego desde el template los obtienes con <?= var ?> tal como se explica en la documentación oficial:

https://developers.google.com/apps-script/guides/html/templates

Aca un ejemplo de un script corriendo con bootstrap que acabo de hacer:
https://script.google.com/macros/s/AKfycbyZ9Hqrlle47GjXDfEQ86ZVp7EVr0vmMy4eL-dX_rOOd4UhVKi9/exec
« Última modificación: 22 Agosto 2016, 19:42 pm por WHK » En línea

Telegram: @WHK102 - Semáforo Epidemiologico Chile
Vegetrans

Desconectado Desconectado

Mensajes: 1


Ver Perfil
Re: Formularios en Google Form Drive
« Respuesta #8 en: 23 Agosto 2016, 20:41 pm »

Gracias por la información, me he pasado toda la tarde buscando en la red algo que me resolviera este tema :) Vaya palo que no dejen publicar css
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines