Crear una pagina web con wordpress desde Hostinger

hola qué tal mi nombre es jorge córdoba en esta oportunidad voy a demostrarles el uso del wordpress pero desde el hosting hosting costing en lo que es un servicio de hosting en el cual se puede instalar varias aplicaciones por decirlo así para poder manejar diferentes ámbitos de trabajo como pueden ver en el hosting hervé bueno ya hemos creado toda nuestra cuenta sabemos cómo hacerlo lo que tendríamos que hacer es simplemente crear una
nueva cuenta y a esta cuenta que hemos creado e instalar desde este panel vamos a entrar al panel dice el panel no todos conocemos este manuel desde aquí donde instalar automático darle clic en y buscar aquí la aplicación que sería el wordpress no si le damos wordpress nos va a instalar y vamos a tener que ayudar en unos datos de los wordpress que por ejemplo acá me pide un hombre de uso administrador le puedo poner por ejemplo jorge pp
bueno que ustedes prefieran y una contracción administrador que obviamente no no es la misma que con la cual ustedes crearon una cuenta de hosting del hosting er no bueno entonces este que tenemos hay dos maneras de poder trabajar el wordpress no una de estas formas es a través de esta configuración que estamos haciendo acá y la otra es a través de la página de la misma página del wordpress yo prefiero hacerlo desde acá porque porque me
parece un poco más amigable de hacerlo no me parece recontra amigable y más sencillo acá me parece que hay unos pasos de más no sé por qué tengo esa sensación pero bueno cada uno tiene sus gustos y preferencias entonces yo por ejemplo ya había creado mi para mí ya había instalado el wordpress en servicio de hosting en un momento voy a entrar con mi cuenta están marcos entramos y yo por ejemplo había creado el el este dominio que se
llama innovatic pero le doy clic ahí y me va a cargar acá en mi tablero de mando y me voy a instalador automático cuando te instalas el wordpress así como hemos visto hace un momento como hice toda esa serie de pasos nos aparece esta pantallita que dice versiones instaladas entonces al darle a detalles nos aparecen los detalles de la aplicación como por ejemplo la url de la página no que es donde yo tengo donde va a aparecer no digamos este
nuestra página y la dirección del administrador que es diferente otra cosa diferente para darle clic aquí en dirección administrador me aparece una nueva pestaña en chrome con el nombre de usuario indicando solicitando un nombre de usuario y contraseña qué más tengo tengo la versión la ruta instalación verdad base de datos el número de usuario perdón el administrador sus datos de la aplicación o sea cuando hemos instalado
automáticamente el hosting él ha creado todos esos parámetros entonces entonces le había comentado que le damos a detalles y le damos a la opción que es el site del administrador que se está de aquí en dirección del administrador dale clic aquí nos dirección a esta pasta nos pide un usuario es el usuario que hemos registrado del ‘post’ o jorge y una contraseña diferente a la que se usa para acceder al hosting en el mapa y entramos a la
página de del gestor de contenidos del wordpress pero en mi dominio como pueden ver aquí en mi dominio no esto de que es publicidad ustedes la lo cierran y bien extra ya estamos en la página yo yo ya hice una página no me pueden ver si vamos a esta dirección borramos esto y me aparece ya mi página que he creado algo sencillo pero me gusta porque se ve bastante llamativo se ve bastante bueno me ven realmente he tratado de hacer algo más de
lo que se hace habitualmente en wordpress no solamente seleccionar un temple y empezar a cambiar el contenido del temple y de acuerdo a la estructura de ese temple y no no me quise ir un poquito más allá e investigando por ahí he encontrado quién es wordpress se puede diseñar bueno sabemos que se pueden diseñar las páginas pero también se puede manejar herramientas que te ayuden a hacer esta configuración de la gestión del contenido de
tu página no a estas herramientas se le llama plugins dentro del ámbito del wordpress y bueno también en otros ámbitos también toma la palabra planning como una herramienta un parche o algo que te ayude no para poder complementar el trabajo que vas a hacer entonces yo aquí tenía una relación de pasos lo que hemos venido siendo por ejemplo los explicó no hemos creado el nombre en el servicio del hosting y hemos creado el nombre del
dominio hemos instalado el wordpress y ahora estamos entrando a la página principal del wordpress para poder hacer pero pueden hacer para poder empezar con la creación de la página ahora este de aquí es la página principal no la página principal como lo vemos del otro lado lo vemos acá cuando tú creas tu página este de casa el dashboard del wordpress que te aparece bueno acá te aparece la configuración de todo lo que puede hacer en el
gol pues no por ejemplo tenemos las entradas vamos a todas las entradas a ver que nos aparece no hay un gel o word que es la página inicial no pues enero en el nueva entrada luego tenemos los enlaces como pueden ver aquí hay bastantes enlaces del wordpress que vienen por defecto instalados luego las páginas que son lo que nosotros a nosotros nos interesa más cómo manejar esto yo voy a crear algunas páginas no así de prueba para poder ir
avanzando qué más tenemos tenemos a los planes que le comentaba pero bien interesante los plugins que son son herramientas que nos ayudan a mejorar aún más el diseño de la página web que vamos a hacer por ejemplo yo investigando un poco he encontrado este sitio que me parece bien interesante y muy didáctico se los voy a poner aquí que se llama tyler puntocom tyler puntocom es una es una página de un sujeto que te ayuda a crear websites
en wordpress pero con una particularidad que es que son bastante bastante bastante intuitiva las páginas son bastante agradables bastante llamativas y bueno realmente en comparación con otras que he visto bueno esta de aquí se hace bueno le digamos que se ve un poco más intuitiva llamativa no es más agradable a la vista por decirlo así entonces por ejemplo mi página una vía mostraba es ésta no acá hay un menú una idea principal no es
una página que hice con relación a un tema de consultoría unos botones acá vemos por ejemplo algunos apartados que desarrollado con planificación desarrollo todo esto lo he hecho relacionado el tema de consultoría como somos ingenieros del sistema vemos tenemos de consultoría de sistemas desarrollo creación de nuevo software etcétera entonces yo había creado previamente ya una página en html5 como pueden ver es esta que también tiene
la misma idea que la crea está creada actualmente en wordpress simplemente ha cambiado el contenido porque el html de aquí digamos que está mucho un poco un poco más trabajo sino que es html5 puro con algunos planes de vuestra y lo que es este angular y también es responsive porque se adapta a cualquier tipo de método a cualquier tipo de dispositivo puede ser una tableta puede ser un con este una lapto etcétera no entonces el contenido del
mismo lo he reflejado aquí en en mi página de wordpress entonces como hacemos como como se hace es bueno le voy a demostrar acá como yo empecé a hacer este desarrollo entonces vamos a la página principal almeida york’ y lo primero que tienen que hacer ustedes es ir a la opción apariencia apariencia y luego temas porque aquí ustedes van a seleccionar el tema con el cual van a trabajar o sea la plantilla sobre qué plantilla van a trabajar
por defecto lugar tres te trae estas tres esta esta y ésta ésta no está yo la he instalado hace un momento les comentaba que había encontrado había encontrado esta página que stiller puntocom visiten la es bastante interesante y en la cual te enseñan a hacer una página una página web en wordpress no te enseñan desde cómo tener el nombre de dominio y el hosting instalando el wordpress sino el login paso a paso muy interesantes para que
ustedes lo revisen yo las ideas principales de este tutorial las estoy comentando cómo les estoy compartiendo con ustedes al hacer haciendo esta demostración entonces éste éste esta página te dan un template de de wordpress tú lo descargas este template y lo puedes subir a tú a tú a tú aquí a tu wordpress que está instalado en tu servicio de hosting por ejemplo yo descargue el de 2015 aquí está out 2015 que era wordpress website 2015
le damos click allí y acá me muestra un vídeo que está en youtube con toda la información respecto a la creación de esta página entonces que he hecho en realidad lo que he hecho es irme esta página no he descargado el template o sea el tema no le descargado no este no es seleccionado un tema cualquiera he ido un poquito más sería investigado un poco y he obtenido he encontrado este temple y de aquí no que lo he descargado de esta
página cuando tú lo descargas me gusta lo vamos a hacer tú descargas aquí le has clic acá y en descargas te va a aparecer un archivo un archivo limpiado que va a tener esta característica puntos y no entonces este archivo zip lladó va a ser el que tú vas a cargar en tu página por ejemplo no estudies añadir nuevo tema le das a añadir nuevo cuando las añadir nuevo de aparecer ya los que están en web lo que están en internet que
wordpress lo está jalando automáticamente y como es un tema que tú vas a subir o sea que tú vas a llevar basadas no vas a escoger uno de los que ya están acá que están en la web sino que tuvo de subir un tema a su vez aquí subir tema subir template selecciona el archivo luego vas a descargas donde están la carpeta de descargas espera que cargue un poco y donde está vamos a buscarlo para castró la explica y le das a abrir de instalar
ahora cuando las instalar ahora espera un momento mientras lo va instalando que pasa les comento un poco para que puedan digamos entenderlo me parece que estoy viendo un poco muy rápido que pasa para poder hacer este tipo de desarrollos en wordpress bueno yo creo que hay dos maneras la primera es seleccionando uno de los templates que el wordpress te facilita no la segunda es que tú crees tu propio template se puede crear template para
wordpress es un poquito es un trabajo ya adicional pero sí se puede hacer entonces si usted ustedes ponen un google credit cree template template wordpress tutorial te aparece acá un montón de información con respecto a es cómo crearlo de acuerdo a bueno ya es digamos es como tú lo quieras crear no pero nosotros no vamos a matándonos bueno no vamos a matar creando o inventando la pólvora porque algo ya está esto ya está hecho pero si
tú quieres investigar un poco más porque no te va te dejo acá este este tipo aquí por ejemplo lo que hace tiller que es esta persona que se ha creado de esta página es eso ha creado un template y ese temple y él lo vende a través de su página conoce cuánto cuesta pero no sé cuánto cuesta pero si él lo vende 20 al temple pero te deja te deja descargarlo para que tú lo puedas probar bueno no necesariamente podemos este hay una
infinidad de templates que están creados y son gratuitos tú lo puedes descargar y también lo puedes este lo puedes cambiar el contenido que es la idea que tenemos que hacer entonces les había dicho que había subido el tema instalando acá me parece un fallo en la instalación del tema bueno lo que pasa es que yo ya tengo uno instalado por eso quien no lo puede no por instalar otro yo ya había instalado uno que es este de aquí pero una
apariencia temas yo ya había instalado este de aquí sólo me dice la demostración y este es el tema del que le estoy hablando que se llama teresa tercera tercera que es el que está activo y con el cual yo estoy trabajando ahora cuando te instalas el tema lo que tienes que hacer primero es ver personalizar un poco no vamos a dar a personalizar y acá en la opción personalizar te va a aparecer todas las opciones con respecto a la página que
tú has ido creando por ejemplo si te vas a generar va a salvar ground la imagen del fondo portada estática aquí hay infinidad de opciones d del wordpress que te permiten gestionar el contenido un momento parece que está que se demora bastante esto por acá mejor para que puedan apreciarlo de otra manera cerramos esto y entonces vamos a apariencia personalizar y acá ya me aparece mi página que ya había creado no les había comentado que el
tema activo es este será que es el tema el temple que yo escogí si gustan lo puedes cambiar las clic allí y seleccionas otro tema que tú quieras entonces sigamos con esto a ver bien luego de que ya haya recogido este tema te sugiero que también cheques de esta parte de los plugins que también son bien interesantes los plugins que es un plan los plan son herramientas que te van a ayudar un montón en hacer el diseño de la página por
ejemplo éste este tutorial que yo he encontrado me muestra o me indica que descargue estos plugins que son bien interesantes por ejemplo este dakar que space wílder by side origin este de aquí vamos a buscarlo yo ya lo tengo instalado pero por ejemplo qué pasaría si no lo tuvieran boyacá y por ejemplo busco uno no por ejemplo page bild pero vamos a ir bueno la descripción dice que es un drag and drop response y page bueno en otras palabras
eso te permite crear páginas web a través de no sé si ustedes han visto objetos de jalar y pegar o sea te muestra opciones drag and drop ojalá si sueltas no para poder crear las páginas estos plugins son herramientas al agua adicional si ustedes gustan lo pueden poner yo les recomiendo que lo hagan porque porque esto te permite hacer el diseño muchísimo más sencillo tal vez los nombres aparecen un poco complicados pero en realidad sirven
un montón bueno yo he instalado todos estos site origin contact force y si google founds este de acá también es interesante que él dice google phone te permite trabajar con el contenido html de la página que tú vas creando y así le damos a buscar esperamos un momento y aquí está siendo way to be wild found for wordpress stent esto te permite crear los fondos hacer personalizar los fondos de la plantilla del wordpress y así como este hay
un montón de temple de plugins que tú puedes utilizar por ejemplo este de aquí este speiser es para dar espacio espacio en la página un espacio digamos éste un espacio por decirlo controlado no un espacio con el que tú no sabes cuánto es el tamaño de esto y te permite regular el tamaño del espacio que tú le puedas dar luego tenemos el tim duncan mover que te permite quitar el título no sé si ustedes se han dado cuenta miren vamos
vamos a ir ya de frente a la página para que ustedes puedan ver cómo las aparece con la playa instalada por ejemplo yo tengo acá la página como que era una página es muy sencillo simplemente le dan acá le ponen le ponen bueno la página no como quieres que se llamen la página a ver vamos a poder que esta página se llame este servicios dios y hoy tengo mi página crea ya servicios no tengo mi página creada servicios mejor lo voy a mejor
les voy a enseñar las páginas servicios como la tengo en servicios y servicios servicios vamos a eliminar este de acá acelera eliminamos porque ya tengo mi página acá no duplicarla si no malograr lo que había avanzado entonces le doy a servicios le doy a editar cuando le doy editar miren como me aparece la página de servicio mientras estaba cargando yo aquí voy entrando a novartis para que ustedes vean cómo vamos a ir cambiando la paz
esta es la página principal y la página de servicios actualmente como ésta está la página inicial de inicio me realiza la misma página no le doy a nosotros he ido avanzando algo de nosotros todavía no le terminado pero más o menos miren cómo se da miren cómo se va dando no la imagen del fondo un pequeño mensaje sobre nosotros que somos un equipo apasionado por el desarrollo no una descripción de los productos y bueno lo que me falta
concluir algo del con respecto a los integrantes de esta empresa pero para que vayan dándose cuenta miren cómo se va formando la página esta página todavía está en desarrollo la página de inicio es la página que está ya terminada no pero bueno si vamos a servicios miren como aparece aparecen así por defecto una página aparece así en el wordpress no entonces lo que tenemos que hacer es evitar esa página hasta crear vamos a editar y
bien miren aquí no no aparece digamos este una página no es una página normal de wordpress porque porque le hemos instalado plugins por ejemplo este plugin de aquí ven añadir objeto este no es un plan perdón este de aquí es la galería multimedia que te permite poner este url es poner imágenes subirlas por ejemplo lo que les había hablado el space ser el space el es este de aquí no si ustedes sabrían speiser le van a agregar un tamaño
de spaces por defecto no por ejemplo que dice 20 x 20 píxeles se va a ver un 20 píxeles entre arriba y abajo lo que más tenemos acá tenemos por ejemplo este que dice html bueno eso sí aparece también por defecto pero el paint wilder no aparece qué hacemos el pay wilder que te permite hacer te permite agregar widgets que son widgets agregar widgets quiere decir que vamos a agregar como que un espacio de trabajo sobre el cual vamos a poder
empezar a hacer el desarrollo de la página por ejemplo le vamos a agregar widgets y acá no es una categoría esto es gracias a los plugins éstos son gracias a los plan sin los plugins esto de aquí no aparecería entonces con los tweets yo te va a permitir crear las páginas y darle digamos un orden no digamos como una arquitectura por decirlo así no con una maqueta no por ejemplo le damos a agregar y le damos a editor visual este editor
visual es el que te permite con este trabajar el contenido del html de una manera muy sencilla ya que hay algunas personas que no conocen mucho sobre el html pero con esto es realmente sencillo entonces si se dan cuenta hemos agregado este editor visual editor visual si vamos a nuestra página vamos a inicio por ejemplo vemos nosotros acá para hacer esto de aquí esta imagen de aquí hemos tenido que agregar un widget un y un visual editor para
poder hacer la modificación del contenido html no acá también hay otro acá hay otro ven acá hay uno más acá hay otro más ya que hay otro más en realidad son varios aquí hay otro más y otro y otro entonces de esa manera si se dan cuenta nosotros hacemos como una maqueta estructuramos los contenidos que vamos a colocar en la página entonces estábamos en servicios le habíamos puesto editor visual y aquí por ejemplo en servicios le
damos a esta opción que dice editar fila diseño y vamos a elegir una imagen de lo que es servicios ahora el tema de las imágenes también les quiero compartir un enlace que tengo por ahí que es bien interesante que se llama un splash puntocom fotos imágenes si se dan este de aquí es bien interesante porque miren se los muestro esta página contiene imágenes en alta resolución que te permite descargarlas son fotos son imágenes bien bien
bien bien interesantes miren por ejemplo miren estas imágenes bien miren estas imágenes son recontra recontra e interesantes y son bastante llamativas por ejemplo si queremos si quiero si yo quiero poner una imagen aquí de algo por ejemplo mi tema ahorita cuales es el tema de consultoría si voy a hacer servicios vamos a poner algo de entonces vamos a ver si encontramos algo de software damos software y buscamos bueno no hay software vamos a
poner services a ver qué pasa a ver ahí se encuentran algunas unas fotos pero no hay muchas solamente hay una vamos a poner tipo para que nos muestre personas de repente encontramos por ahí una imagen interesante miren nuestras imágenes miren esta imagen es bastante bastante interesante y está en alta resolución te las puedes descargar y la puedes usar en tu página tranquilamente no pasa nada no te van a cobrar qué más tenemos ver por
acá no hay ninguna imagen que pueda y funcionar como página de servicios no como para darle s a ver de repente por acá si pongo consulting fácil que sale algo no hay nada bien qué hacer entonces y servicios a ver vamos a poner computer con sting vamos a ver connecting de repente por ahí nos aparece algo smartphone no vamos a poner mejor completo y más imágenes ya sé por ejemplo esta imagen que parece interesante vamos a poner ahí y la
vamos a descargar la moza download la mujer y derecho guardar imagen como y acá le ponemos la imagen no ponemos vamos a poner los servicios servicios imagen imagen punto y he borrado la extensión en realidad es jpg a salvar esto vamos a cambiarlo por un jpg y jpg y acá vamos a ponerles servicios consulting a guardar y ya baja vamos a mostrar un finde para saber dónde está perfecto entonces les había mostrado esa página con la cual yo he
descargado algunas para poder responderle en mi página no y esta es la ruta si no se acuerdan se llama un plan puntocom entonces voy a subir una imagen le damos a seleccionar archivo vamos a imágenes de estas imágenes acá y acá hay una imagen servicios consultivos vamos a subir esperamos que cargue un poco que cargue dv me parece raro porque no está cargando lo que pasa es que como la imagen es bastante es pesada porque es en alta
resolución es por eso que se está demorando un poco en cargar bien mientras van cargando les voy a mostrando otras cosas entonces cuando tuve cuando tú entras a tu página acá en la parte de arriba te aparece las opciones para poder hacer la edición no editar página o personalizar otro contenido también le quiero dejar otros otro tip que es con respecto a estos iconos si se dan cuenta mira que hay unos iconos bien bonitos muy interesantes
también y de donde los he sacado de otra página esta página también es bien interesante para otras actividades tal vez le pueda servir se llama logo marc le damos enter y miren lo que nos que nos aparece bueno acá nos aparece un tutorial de cómo hacerlo yo les explico rápidamente en qué consiste por ejemplo que quiero buscar imágenes de no sé smartphone no dame así buenas personas pero las imágenes que no se parecen no o si le pongo
computer a lo mejor lo mejor vamos a ponerle y vamos a ponerle el work jobs nos aparecen los trabajos entonces con esto tú seleccionas una imagen tú le puedes agrandar achican puedes cambiarle su tono y se dan cuenta bien interesante y nuestro lo que más te guste lo descargas con este botón de blog y de descargar la imagen obviamente que acá te aparece crédito copping el truco de los credit que son lo que pasa es que es como estos servicios
son gratuitos ellos no ganan nada por esto que tú estás haciendo pero tú puedes ayudar a que esta página ciudad conocida copiando este clic here to copy credit para que luego tú lo publiques en part 1 y de esta manera hay más personas que se enteran de este servicio bueno hoy vamos a ver cómo va el tema ya lo cargo no le doy seleccione esa selección automáticamente le doy a ton una vez que esté en un seleccionado esta imagen no le vamos
a dar aquí donde dice mosaico visualización de la imagen de fondo le vamos a cubrir cubrir por qué y no centrado con tamaño lo que pasa es que cubrir va a tomar todo el ancho o mejor dicho va a tomar toda la imagen y la va a poder tal como está no le damos a hecho y ya está la imagen ahí luego acá aparece por ejemplo little haiti todo lo que la vida es otro plugin por ejemplo pero vamos a dejarlo así nomás ya y vamos a actualizar y
luego vamos a ver cómo nos sale pero vamos a poner algo de servicios vamos a visitar y vamos a colocar algo en html cuando mejor dicho vamos a ponerlo en visual más y luego lo pasamos a html ya les dije este dato del logo marc no para que lo puedan checar también le dejé el plan para las imágenes que se ven bien interesantes esta imagen que me he descargado vamos a cerrar estas imágenes que ya no vamos a usar esto tampoco vamos a entrar a
mi otra página para sacar el contenido de acuerdo el contenido e servicio no mejor vamos a poder estudiar que me parece más interesante este mensaje copiamos proponemos acá en un editor visual vamos ahí no entonces todo lo que puedes hacer es centrarlo no darle un espacio a ese contenido por defecto vamos a ponerle por ejemplo 30 de espacio entonces quiere decir que desde donde aparece la página hacia arriba para baba se va a separar 30
píxeles y va a aparecer este mensaje no luego también es importante que les den acá en diseño acá y aparece una opción que dice imagen en mosaico pero no es solamente aquí es para editar el texto y ver en html y aquí está el space air y acá por ejemplo haciendo un poquito de html ustedes pueden colocar lo siguiente vamos a colocar por ejemplo un spam dirán que es un spam tenemos esto por aquí y lo ponemos la otra estoy haciendo un
poco de html cuando estamos con m o con n estoy segura de un momento para html para qué sirve es pan con esta etiqueta span detalle de la etiqueta expansión los aromos aves para que ustedes se pueden enterar lo que pasa es que estoy colocando un poco de html a esta plantilla y porque le pongo spam lo que pasa es que voy a poner un estilo voy a ponerle en este un poco de color por decirlo así para que se vea de una manera más atractiva
entonces por eso quiero ponerlo dentro de una etiqueta span que me va a permitir ponerle un poco de color no es muy sencillo esto como ustedes no saben html lo que pueden hacer lo siguiente me vamos a olvidarnos del estado pero me parece que vamos vamos a volar ahí sí si es que no no lo ponemos a perfecto entonces está tal como está no visual está ahí con espacio y esto centrado no y el html entonces lo único que tienen que hacer ustedes
es poner es hacer esto miren vamos a hecho le damos a hecho y aquí vamos a dar por un momento vamos hacer otra modificación para que la imagen pueda salir bien anchura total diseño de la fila era total esta es una fila no íbamos a poner anchura total para que coja todo el ancho para que no solamente se quede limitado le vamos a hecho y aún nos falta poder el hi título lo voy a dejar ahí voy a publicar esto para que vean cómo se ha como se
ve yo lo de aquí actualizo mi página y luego le doy a servicios a ver que aparece en servicio vamos a ver está cargando debe ser la imagen he empezado pero se está demorando miren que aparece sabe por qué aparece esto porque esto de acá digamos este como el contenido por defecto que te aparece en el wordpress y lamentablemente hay veces que no podemos tocarlo no podemos modificarlo entonces también se dan cuenta que aparece esto mire
aparece en el título servicios y es me parece también absurdo que si sabemos qué servicios y nos aparezcan nuevos servicios nada que ver no entonces para eso es el plugin que le dice en haiti le damos a editar de nuevo y le doy aquí haiti luego le dice plantilla y esta plantilla predeterminada es por lo que está saliendo actualmente esas opciones de que nos aparecen a la izquierda vamos a ponerle su wild page in haiti para que se borre es
vamos a actualizar y le damos a del página y ya está ven y se dan cuenta nos aparece de esta manera y ya va tomando un poco de forma lo que queremos hacer no vamos a inicio nos aparece la página principal vamos a servicio nos aparece esta imagen ahora este podemos aún evitar esto pero me gustaría ponerle un poco de estilo la letra porque me dan cuenta la imagen no deja que la letra se vea entonces y vamos a ponerle un poco de estilo para
esto tenemos que hacer le damos aquí a editar y aquí necesariamente tenemos que cambiará algo entonces vamos a ponerle la etiqueta span cerramos la etiqueta span así está listo perdón esta etiqueta están acá vamos a ponerle el class no el cual va a permitirnos ponerle el estilo entonces ahí este vamos a ponerle por ejemplo para que ustedes puedan darse cuenta vamos a ponerle estilo lyon no sé servicio por ejemplo estilo título servicio
estilo título servicio es el nombre de la clase del class que vamos a usar que le va a dar estilo a esta letra entonces para eso simplemente esto de aquí nos acordamos lo apuntamos lo copiamos vamos a hecho vamos a actualizar y luego nos vamos por aquí por él dice ajustes y vamos a google alfons google phone es otro plan que había instalado no se acuerda que le había mencionado los planes instalados le dije no instalen estos planes son
interesantes te van a ayudar a poder hacer la página mucho más dinámica mucho más didáctica mucho más bonita mucho más atractiva que que haciéndolo a través del wordpress ha sido más sin usar nada también lo puedes hacer sí pero no va a llegar a este nivel que queremos llegar con esto no entonces con él y sigo el fons que haces haces justamente eso agregas estilos unos estilos bien interesantes miren por ejemplo vamos aquí y si
google ajustes google phone ya está instalado el plugin no lo único que tenemos que hacer es crear un nuevo estilo vamos a ver crear y éste le vamos a poner de nombre control online el control sea cómo se va a llamar este estilo vamos a poner es y luego con el estilo i vamos a poner el estilo no sé servicio yo no damos a crédito y luego le damos acá vamos a ponerle cómo lo estamos llamando al otro lado o sea como lo hemos colocado
realmente en nuestro en nuestra en nuestro código html todo puesto sin equivoco lo copiado le doy control de estilo título servicio y ahí adelante le ponemos el punto luego le doy a 6 y ya está entonces qué va a pasar que hemos hecho para explicarte más o menos que hemos hecho lo que hemos hecho en este momento ha sido crear este estilo no lo estamos nombrando para que él ahora le pongamos las características del estilo ya sea el tamaño
de letra el color el fondo cómo se va a ver y etc entonces para esto nos vamos aquí a herramientas no perdón apariencia personalizar acá no va a agregar la página le damos acá servicios para que vean cómo se va cambiando cambiando automáticamente no juanjo me parece que no por completo esto me parece raro no no no voy a editar la página lo que pasa es que no ha cogido algunos cambios que hice por ejemplo en haiti la plantilla
predeterminada o sea para mí está saliendo actualmente esto porque porque estamos todavía con la plantilla predeterminada y también me está saliendo esto porque no le hemos dado la opción haiti pto que ya está le damos a actualizar y si ustedes se dan cuenta también mire a que aparece el nombre del enlace ya automáticamente servicios si ustedes gustan lo cambien no hay problema eso es evitable pero ya lo tengo limpiado por defecto
aparece que es una página y por defecto que aparece con el nombre de la página entonces ya está si le damos aquí actualizar por ejemplo le vamos a o sea el inicio le volvamos a servicio ya debería aparecer ojo como habíamos quedado entonces estábamos aquí esta es la página principal el dashboard principal donde lo que es este el template entonces le damos a tipo f para escoger el tipo de letra acá aparece en el tema tipografía que que
es el tema tipografía o sea el tipo graphics se refiere a los temas ópera mejor dicho a los estilos que estamos colocando dentro de nuestro de nuestra plantilla como hemos hecho eso hemos hecho eso cuando hemos generado cuando hemos creado el estilo aquí si se dan cuenta pero no es esa este de aquí ese estilo título servicio es el que hemos estamos creando para poder ponerle un poco de color a esto de acá entonces le damos aquí y aquí
debería aparecer nuestro estilo no aparecen al parecer anuncia que está estilo servicio entonces le damos clic aquí y acá nos aparece un montón de opciones para poder hacer de esta letra algo mucho más atractivo y no no es que no sé y que se puede haber claro no por ejemplo family font family vamos a un tipo de letra y yo estaba trabajando con la de robot o robot o que es un tipo de letra interesante no luego de eso le podemos dar a cada
uno un fondo with que es un tamaño por ejemplo si le pones 500 esto se va a agrandar un poquito si le pones 900 un poquito más o sea se va a ver un poquito como que más hinchada la letra no vamos a ponerle 300 ya y acá hay otra opción que dice apariencia le damos a apariencia podemos elegir un color de background vamos a dejarlo ahí como está pero vamos a cambiar el color del fondo vamos a ponerle un fondo más blanco porque creo que el
blanco se ve ahí muy bien si le ponemos blanco entonces se queda en el blanco seleccionamos el color actual y podemos ponerle un forfait un tamaño de letra con esto nosotros podemos modificar el tamaño de letra pero se hace más dinámico más interesante por ejemplo ahí ahora también podemos poner la posición por ejemplo que hay también hay en live in line height quiere decir el tamaño entre líneas hay una anchura siguiente entre entre
esto y esto esto de acá es el line height key perdón vamos a dejarle el que está por defecto luego de aparecer leer space en tamaño entre letra y letra si ustedes se gustan lo ponen más les gusta lo ponen menos vamos a dejarlo como está luego de eso hay otro que es position position que va a permitir cambiar o mejor dicho es ubicar mejor esto por ejemplo si ustedes ponen un margen margin top que quiere decir vamos a poner un poco más abajo
por ejemplo vamos a ponerlo ahí luego aparece un margin bottom margin botones de abajo no vamos a ponerlo bastante vamos a ponerle 300 y tanto por ahí está bien vamos a ponerle 260 y ahora y ya está ahora vamos a ponerle el padding el pan que es el país como que espacio entre 1 / esto o sea el margen ahorita estamos tocando esto de acá esto de aquí es lo que estamos modificando lo que está acá en lo de las letras entonces al decirle
margin estamos tocando los márgenes tanto superior inferior izquierdo y derecho solamente hemos tocado pero el margen superior e inferior no ahora el padre el padding es con respecto a esto o sea esto de aquí es como un bloque y con el padding lo podemos mover ves izquierda pero no vamos a tocarlo simplemente lo hago para que ustedes conozcan estos términos que son interesantes realmente el todo esto es tema ya de diseño de la página es html
css que es lo que permite hacer una página dinámica una página que se vea vistosa que sea llamativa entonces ya tenemos esto dejémoslo ahí porque si se ve tal vez si le ponemos un poquito de de 90.000 litros está bien me parece que el background también está bien pero podemos cambiar un poquito al baño libre en el blanco dejarlo ahí así como esta muy bien le damos entonces la opción guardar y publicar guardando y está guardado
perdón y ahora si ustedes gustan podemos ver la página y no muestra servicios mire cómo se muestran servicios ahora por ejemplo yo que tengo en servicios en mi página de perú consulting tengo esta consultoría desarrollo sistema de integrado en como pongo es sobre esta página digamos que esto es como una cabecera como un pre ángulo de los servicios cansado de los problemas operativos dale 107 empresas todo lo que nosotros queremos
marketear lo ponemos al comienzo y más abajo ya mostramos una descripción del detalle como hacemos esto editamos esta página vamos a editar ahora vamos a agregar una fila esto de acá es una fila o sea esto es una fila ahora vamos a ver una fila más pero vamos a poner lo vamos a dividirlo en columnas eso es lo que te es la ventaja que te da trabajar con los planes hacer este tipo de diseños veces más dinámicos si ponemos 3 los separa 3 de
la misma del mismo tamaño le damos a insertar y ahora vamos a insertar también with para poder trabajar con el contenido así como el de arriba vamos a poner un widget vamos a agregar un widgets vamos a ponerle editor visual de aquí vamos a ponerle cubrir en esto puedes duplicar esto si no puedes hablar para acá para no hacerlo en todos ya está perfecto qué hacemos vamos a editar este de aquí y vamos a tratar de ponerle por ejemplo vamos a
ponerle consultorías de este consultorías editar perdón es cierto que tenemos que ponerlo dentro del contenido html a ver cómo lo hacemos ya ya sé cómo les había comentado que tenía aquí yo predefinido ya mejor dicho una especie de manual o tutorial en el cual yo puedo seleccionar este o sea en base a lo que me he guiado yo de este manual de este pequeño tutorial entonces a ver acá podemos poner vamos a agarrar esto de acá que ya
está creado simplemente estoy agarrando para por las etiquetas nada más por las etiquetas lo ponemos acá no acá ya tenemos una clase creada con esto vamos a poner simplemente es simplemente dos cosas y esto y también no work ponerle y voy a ponerlo para que vean cómo sale y acá vamos a poner el contenido de estos consultorías y lo pongo y vamos a cambiar esto de diseño y ya está es todo le damos a actualizar a ver que nos aparece y
vamos a ver pasta a ver qué sale bien ven cómo se arregla ven que se ha puesto de manera correcta ahora mira lo que voy a hacer de estos dones entonces esta página meditamos un pequeño lapsus acá vamos a la parte visual la parte de acá vamos a ponerle un un space air al trabajo que sea de 20 para que no salga step y esto lo centramos vamos a hecho vamos a actualizar para que vean como aparece vamos aquí vamos aquí y vamos a ver página o
un problema me parece que hubo un problema ya ya sé cuál es el problema lo que pasa es que se ha movido las etiquetas de h de html se han cerrado mal me parece vamos aquí baja el centro que estoy aquí no debió salir así siempre ahora sí está bien estamos aquí vamos a actualizar y yo resistiremos ver la página y sigue saliendo grande qué pasa aquí entonces con esto sería pequeño allá lo que pasa es que no es eso sino que esto de
aquí ya está definido de esa manera permite en un momento ya vamos a ver en la otra página y vamos a copiar para no hacer un nuevo un nuevo un nuevo estilo a ver por ejemplo este de acá a ver cómo está hecho una imagen ya vamos aquí y se dan cuenta planificación está en h2 vaya parece que no no hay mucho de clase por acá así que nuestro reto el problema está en que lo estamos poniendo dentro de eso y eso es estábamos haciendo antes
servicios editamos vamos a quitarle el html ya parece que ese es el problema atenas vamos a quitar el vamos a poner así con simplemente no sé quitaré el spam lo estaba logrando eso se queda así y y esto de acá vamos a dejarlo ahí porque me parece que éste está casi está si está bonito vamos a echo autorizaron se actualizó la página damos a leer y ver cómo aparece ahora sí estaba mucho mejor entonces es algo bien sencillo acá por
ejemplo le habíamos dado una anchura ya esto ya que le hayamos dado otra anchura no aquí habíamos puesto una fila no ya que habíamos puesto tres filas que en realidad falta poner el contenido aquí el contenido acá no si nosotros queremos ver vamos a editar y por ejemplo vamos a copiar vamos eliminar este de aquí vamos a duplicar esto vamos a duplicar para que vean cómo quedaría como es lo que estoy tratando de que estoy pretendiendo
hacer esto lo colamos seca podemos agregar una fila más podemos poner los dedos e insertamos lo movemos que vaya abajo tocamos esto duplicamos esto ojalá vamos a sacar básica actualizamos cómo se ve cómo se ajusta eso es lo que eso es lo bueno de trabajar con los planes los planes te ayudan y te permiten hacer este tipo de cosas entonces al hacer esto al hacer este tipo de cosas ya no ya no nos ya no nos regimos tanto en el template o sea el
temple ya no es un obstáculo para hacer lo que nosotros queremos hacer realmente porque de repente cogemos un template y como no sabemos utilizar mucho el tema del html y esto tenemos un poco de temor y nos regimos a la plantilla la seguimos así como está no la podemos modificar pues con esto sí se puede y podemos hacer cosas como esto y de salud bien interesante entonces es más o menos ayuda que estoy en esta oportunidad algo que yo he
investigado por mi cuenta pero sé que ustedes también lo pueden hacer porque el internet está para todos les dejo nuevamente la esta dirección styler puntocom para que lo visiten para que el h que acá está todo como hacer una página desde cero bien interesante bien bien interesante como lo había explicado que más haya bueno también están los plugins y los planes que habíamos cree que les había mencionado si usted es bucle en cada uno
de estos van a encontrar bastante información sobre para qué sirve más exactamente también las fotos las fotos e imágenes es decir grave solo porque de alguna u otra manera en algún otro momento van a tener que usarlos los dejo ahí y bueno eso sería todo bueno eso sería todo trataré de terminar la página para presentarla el día sábado ya un poco más completo y con un diseño un poquito más este más atractivo lo que les daba acá
son algunas pinceladas para que ustedes puedan investigar también por su cuenta y como también pueden trabajar en el mismo hosting en el hosting que ustedes hayan seleccionado hoy han escogido sin necesidad de entrar a la página principal de wordpress no quedan mi personalmente no me parece muy amigable pero sí se puede trabajar también allí de la misma manera claro también se puede instalar play y hacer todo lo que hemos hecho acá en la
página principal de wordpress eso sería todo en esta oportunidad gracias