{"id":102,"date":"2015-04-17T15:51:16","date_gmt":"2015-04-17T15:51:16","guid":{"rendered":"http:\/\/wjharil.com\/blog\/?p=102"},"modified":"2015-10-16T22:46:08","modified_gmt":"2015-10-16T22:46:08","slug":"placeholder-de-imagen-php","status":"publish","type":"post","link":"https:\/\/wjharil.com\/blog\/placeholder-de-imagen-php\/","title":{"rendered":"Placeholder de imagen con PHP (placehold.it script)"},"content":{"rendered":"<p>B\u00e1sicamente, hoy aprenderemos a crear un<strong> script para generar un placeholder de im\u00e1genes con PHP<\/strong> y su <strong>librer\u00eda GD<\/strong>. De \u00e9ste modo, obtendremos un <strong>clon del script placehold.it<\/strong>.<\/p>\n<h2>Para qu\u00e9 nos puede servir \u00e9sta script de placeholder de im\u00e1genes?<\/h2>\n<p>Para muchas cosas, en especial, para cuando estemos desarrollando un sitio web y necesitemos <strong>im\u00e1genes<\/strong> para ir d\u00e1ndonos una gu\u00eda de c\u00f3mo es que quedar\u00e1 la maqueta final.<\/p>\n<p>Haremos uso de 3 archivos, uno que se debe llamar <em>index.php,<\/em> otro que ser\u00e1 un htacces (se debe llamar<em> .htaccess<\/em>) y por \u00faltimo la fuente que se usar\u00e1.<\/p>\n<p><strong>index.php<\/strong>:<\/p>\n<pre class=\"lang:php decode:true\" title=\"index.php\">if(isset($_GET)){\r\n\t$imagedata = explode('-',$_GET['id']); \r\n\tif (!is_array($imagedata) || count($imagedata) != 4) \/\/If something goes wrong\r\n        {\r\n            die(\"Something wrong there!! It should be like - placeholder\/350-150-CCCCCC-969696\");\r\n        }\r\n\tcreate_image($imagedata[0], $imagedata[1], $imagedata[2], $imagedata[3]);\r\n\texit;\r\n\r\n}\r\n\r\n\/\/Function that has all the magic\r\nfunction create_image($width, $height, $bg_color, $txt_color )\r\n{\r\n    \/\/Define the text to show\r\n    $text = \"$width X $height\";\r\n\r\n    \/\/Create the image resource \r\n    $image = ImageCreate($width, $height);  \r\n\r\n    \/\/We are making two colors one for BackGround and one for ForGround\r\n\t$bg_color = ImageColorAllocate($image, base_convert(substr($bg_color, 0, 2), 16, 10), \r\n\t\t\t\t\t\t\t\t\t\t   base_convert(substr($bg_color, 2, 2), 16, 10), \r\n\t\t\t\t\t\t\t\t\t\t   base_convert(substr($bg_color, 4, 2), 16, 10));\r\n\r\n\t$txt_color = ImageColorAllocate($image,base_convert(substr($txt_color, 0, 2), 16, 10), \r\n\t\t\t\t\t\t\t\t\t\t   base_convert(substr($txt_color, 2, 2), 16, 10), \r\n\t\t\t\t\t\t\t\t\t\t   base_convert(substr($txt_color, 4, 2), 16, 10));\r\n\r\n    \/\/Fill the background color \r\n    ImageFill($image, 0, 0, $bg_color); \r\n    \r\n\t\/\/Calculating (Actually astimationg :) ) font size\r\n\t$fontsize = ($width&gt;$height)? ($height \/ 10) : ($width \/ 10) ;\r\n    \r\n\t\/\/Write the text .. with some alignment astimations\r\n\timagettftext($image,$fontsize, 0, ($width\/2) - ($fontsize * 2.75), ($height\/2) + ($fontsize* 0.2), $txt_color, 'Crysta.ttf', $text);\r\n \r\n    \/\/Tell the browser what kind of file is come in \r\n    header(\"Content-Type: image\/png\"); \r\n\r\n    \/\/Output the newly created image in png format \r\n    imagepng($image);\r\n   \r\n    \/\/Free up resources\r\n    ImageDestroy($image);\r\n}<\/pre>\n<p><strong>\u00a0.htaccess<\/strong>:<\/p>\n<pre class=\"lang:default decode:true\">RewriteEngine On\r\nRewriteRule ^([a-zA-Z0-9_-]+)\/$ index.php?data=$1<\/pre>\n<p>El <strong>modo de uso<\/strong>, es el siguiente: http:\/\/web.com\/350-150-CCCCCC-969696 en d\u00f3nde:<\/p>\n<p>350 es el ancho.<br \/>\n150 es el alto.<br \/>\nCCCCCC es el color de fondo.<br \/>\n969696 es el color de la fuente.<\/p>\n<p><a href=\"http:\/\/motyar.blogspot.com\/2010\/09\/create-image-placeholder-with-php.html\" target=\"_blank\">V\u00eda <\/a>| <a href=\"https:\/\/github.com\/wjharil\/PlaceholderImagenes\/\" target=\"_blank\">Descargar c\u00f3digo<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>B\u00e1sicamente, hoy aprenderemos a crear un script para generar un placeholder de im\u00e1genes con PHP<br \/><a class=\"moretag\" href=\"https:\/\/wjharil.com\/blog\/placeholder-de-imagen-php\/\">Continuar Leyendo...<\/a>","protected":false},"author":1,"featured_media":103,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[35],"tags":["php"],"featured_image_src":"https:\/\/wjharil.com\/blog\/wp-content\/uploads\/2015\/04\/placeholder-script-imagen.gif","categorias":["Facebook","Fuera de tema","Recursos","Tutoriales"],"_links":{"self":[{"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/posts\/102"}],"collection":[{"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/comments?post=102"}],"version-history":[{"count":5,"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/posts\/102\/revisions"}],"predecessor-version":[{"id":117,"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/posts\/102\/revisions\/117"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/media\/103"}],"wp:attachment":[{"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/media?parent=102"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/categories?post=102"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wjharil.com\/blog\/wp-json\/wp\/v2\/tags?post=102"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}