{"id":12190993,"date":"2020-11-26T16:48:31","date_gmt":"2020-11-26T16:48:31","guid":{"rendered":"https:\/\/es.wordpress.org\/support\/topic\/preloader\/"},"modified":"2020-11-26T17:45:46","modified_gmt":"2020-11-26T17:45:46","slug":"preloader","status":"publish","type":"topic","link":"https:\/\/es.wordpress.org\/support\/topic\/preloader\/","title":{"rendered":"Preloader"},"content":{"rendered":"

Hola, necesito insertar un preloader a mi pagina de wordpress.<\/p>\n

Me han enviado este c\u00f3digo con las 3 imagenes respectivamente<\/p>\n

donde y como se debe realizar la carga de este c\u00f3digo?<\/p>\n

<!DOCTYPE html>\n<html>\n<head>\n<meta charset="UTF-8">\n<title>Loading Tartarizados<\/title>\n <meta name="description" content="">\n\n<style type="text\/css">\n\tbody{\n\t\tbackground-color:#5a3284;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\theight: 100vh;\n\t\talign-items: center;\n\t}\n\n\t#logo{\n\t\tposition: relative;\n\t\twidth: 200px;\n\t\theight: 200px;\n\t\t\/*border: 1px solid red;\n\t\t\/*display: flex;\n\t\tjustify-content: center;\n\t\tflex-direction: column;\n\t\t\/*align-items: center;*\/\n\t}\n\t#rosa{\n\t\tposition: absolute;\n\t\tleft:5px;\n\t\ttop: 16px;\n\t\tanimation-name: rosa;\n\t\tanimation-duration: 3.5s;\n\t\tanimation-iteration-count: infinite;\n\n\t}\n\n\t@keyframes rosa{\n\n\t\t0%{\n\t\t\topacity: 0;\n\t\t\ttransform: scale(.3) rotate(0deg);\n\n\t\t}\n\n\t\t30%{\n\t\t\topacity: 1;\n\t\t\ttransform: scale(.8) rotate(360deg);\n\t\t}\n\n\t\t50%{\n\t\t\topacity: 1;\n\t\t\ttransform: scale(.8) rotate(360deg);\n\t\t}\n\n\t\t100%{\n\t\t\topacity: 0;\n\t\t\ttransform: scale(.3) rotate(0deg);\n\t\t}\n\t}\n\n\t#amarillo{\n\t\tposition: absolute;\n\t\tleft:80px;\n\t\ttop: 45px;\n\t\tanimation-name: amarillo;\n\t\tanimation-duration: 3.5s;\n\t\tanimation-iteration-count: infinite;\n\t}\n\n\t\t@keyframes amarillo{\n\n\t\t0%{\n\t\t\topacity: 0;\n\t\t\ttransform: scale(.3) rotate(0deg);\n\n\t\t}\n\n\t\t30%{\n\t\t\topacity: 1;\n\t\t\ttransform: scale(.8) rotate(360deg);\n\t\t}\n\n\t\t50%{\n\t\t\topacity: 1;\n\t\t\ttransform: scale(.8) rotate(360deg);\n\t\t}\n\n\t\t100%{\n\t\t\topacity: 0;\n\t\t\ttransform: scale(.3) rotate(0deg);\n\t\t}\n\t}\n\t#celeste{\n\t\tposition: absolute;\n\t\tleft: 54px;\n    \ttop: 122px;\n\t\tanimation-name: celeste;\n\t\tanimation-duration: 3.5s;\n\t\tanimation-iteration-count: infinite;\n\t}\n\n\t@keyframes celeste{\n\n\t\t0%{\n\t\t\topacity: 0;\n\t\t\ttransform: scale(.3) rotate(0deg);\n\n\t\t}\n\n\t\t30%{\n\t\t\topacity: 1;\n\t\t\ttransform: scale(.8) rotate(360deg);\n\t\t}\n\n\t\t50%{\n\t\t\topacity: 1;\n\t\t\ttransform: scale(.8) rotate(360deg);\n\t\t}\n\n\t\t100%{\n\t\t\topacity: 0;\n\t\t\ttransform: scale(.3) rotate(0deg);\n\t\t}\n\t}\n\n<\/style>\n\n<\/head>\n<body>\n<div id="logo">\n\t<div  id="rosa"><img \/><\/div>\n\t<div  id="amarillo"><img src="img\\estrellas-02.png" \/><\/div>\n\t<div  id="celeste"><img \/><\/div><\/code><\/pre>\n","protected":false},"template":"","class_list":["post-12190993","topic","type-topic","status-publish","hentry","topic-tag-css","topic-tag-html","topic-tag-preloader","topic-tag-wordpress"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/12190993","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic"}],"about":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/types\/topic"}],"version-history":[{"count":1,"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/12190993\/revisions"}],"predecessor-version":[{"id":12190995,"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/12190993\/revisions\/12190995"}],"wp:attachment":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/media?parent=12190993"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}