WordPress - Permitir etiquetas HTML como target, rel en bio de autor

En la Biografia de autor WordPress por defecto no permite escribir ciertas etiquetas HTML, por ejemplo, puedes escribir <a href="xxx">xxxxxx</a> pero no puedes darlos los atributos de rel, ni de target.

Para ello tenemos una solución muy simple, sola mente tenemos que instalar y activar el siguietne plugins

https://wordpress.org/plugins/allow-rel-and-html-in-author-bios/

Y asunto solucionado, espero que os sirva de ayuda

JQuery jugar con capas

Hoy os traigo algunas funciones utiles en JQuery para interactuar con las capas

•     $(capa).after(contenido);

La funcion After te deja colocar un contenido despues del selector

•     $(capa).before(contenido);

Igual que la anterior, pero esta coloca el contenido antes del selector

•     $(capa).html(contenido);

Sirve para sustituir el valor del contenido

•     $(capa).animate(animacion, duraccion, funcion al finalizar);

Anima un selector

•     $(capa).addClass(clase);

Añade una clase al selector

•     $(capa).removeClass(clase);

Este la elimina


JQuery tiene muchas mas funciones interesantes, pero he seleccionado estas por considerarla las mas utiles y usadas, cuales echais de menos???

Os dejo un ejemplo de todas las anteriores en mi GitHub

Aparecen etiquetas HTML en selector de datos - Drupal

Me he encontrado con este error, en el Data Selector de las reglas en Drupal 7 me aparecían etiquetas HTML como podéis ver abajo; en lugar de un simple texto en el desplegable, desde el cual escoger la opción que mas nos interese en cada momento

Etiquetas duplicadas en IE-8 - Drupal

Hace  unos días me encontré con un error que me trajo de cabeza, abría mi web en cualquier navegador moderno y funcionaba a la perfección, pero en IE8 hacia cosas muy extrañas, todo indicaba a que mi JavaScript tenia alguna función no compatible con Internet Explorer 8, después de revisarlo y hacer varios cambios seguía igual, o muy parecido, con el inspector de la pagina veo que solo en IE8 me aparecían varias etiquetas que yo no había añadido, me había duplicado etiquetas div, y lo peor me las duplicaba con el mismo ID por lo que mi JS se volvía loco y no sabia por donde atacar, no entendía por que, que razón podía tener IE8 para duplicarme etiquetas?, encontré el enlace que os dejo aquí:

Mi primera colaboración en el baúl del programador

Introducción al HTML5
http://elbauldelprogramador.com/html5-2/introduccion-html5/

Listado países HTML

Otro listado de países en HTML para que tan solo tengan que copiarlo en sus diseños
Espero os sirva de ayuda ;)

<select name="pais">

<option value="Andorra">Andorra</option>

<option value="Spain">España</option>

<option value="France">France</option>

<option value="United Kingdom">United Kingdom</option>

<option value='-' disabled>――――――――</option>

<option value="Afghanistan">Afghanistan</option>

<option value="Albania">Albania</option>

<option value="Algeria">Algeria</option>

<option value="American Samoa">American Samoa</option>

<option value="Angola">Angola</option>

<option value="Anguilla">Anguilla</option>

<option value="Antarctica">Antarctica</option>

<option value="Antigua and Barbuda">Antigua and Barbuda</option>

<option value="Argentina">Argentina</option>

<option value="Armenia">Armenia</option>

<option value="Aruba">Aruba</option>

<option value="Australia">Australia</option>

<option value="Austria">Austria</option>

<option value="Azerbaijan">Azerbaijan</option>

<option value="Bahamas">Bahamas</option>

<option value="Bahrain">Bahrain</option>

<option value="Bangladesh">Bangladesh</option>

<option value="Barbados">Barbados</option>

<option value="Belarus">Belarus</option>

<option value="Belgium">Belgium</option>

<option value="Belize">Belize</option>

<option value="Benin">Benin</option>

<option value="Bermuda">Bermuda</option>

<option value="Bhutan">Bhutan</option>

<option value="Bolivia">Bolivia</option>

<option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>

<option value="Botswana">Botswana</option>

<option value="Bouvet Island">Bouvet Island</option>

<option value="Brazil">Brazil</option>

<option value="British Indian Ocean Territory">British Indian Ocean Territory</option>

<option value="Brunei Darussalam">Brunei Darussalam</option>

<option value="Bulgaria">Bulgaria</option>

<option value="Burkina Faso">Burkina Faso</option>

<option value="Burundi">Burundi</option>

<option value="Cambodia">Cambodia</option>

<option value="Cameroon">Cameroon</option>

<option value="Canada">Canada</option>

<option value="Cape Verde">Cape Verde</option>

<option value="Cayman Islands">Cayman Islands</option>

<option value="Central African Republic">Central African Republic</option>

<option value="Chad">Chad</option>

<option value="Chile">Chile</option>

<option value="China">China</option>

<option value="Christmas Island">Christmas Island</option>

<option value="Cocos (Keeling) Islands">Cocos (Keeling) Islands</option>

<option value="Colombia">Colombia</option>

<option value="Comoros">Comoros</option>

<option value="Congo">Congo</option>

<option value="Cook Islands">Cook Islands</option>

<option value="Costa Rica">Costa Rica</option>

<option value="Cote D'ivoire">Cote D'ivoire</option>

<option value="Croatia">Croatia</option>

<option value="Cuba">Cuba</option>

<option value="Cyprus">Cyprus</option>

<option value="Czech Republic">Czech Republic</option>

<option value="Denmark">Denmark</option>

<option value="Djibouti">Djibouti</option>

<option value="Dominica">Dominica</option>

<option value="Dominican Republic">Dominican Republic</option>

<option value="Ecuador">Ecuador</option>

<option value="Egypt">Egypt</option>

<option value="El Salvador">El Salvador</option>

<option value="Equatorial Guinea">Equatorial Guinea</option>

<option value="Eritrea">Eritrea</option>

<option value="Estonia">Estonia</option>

<option value="Ethiopia">Ethiopia</option>

<option value="Falkland Islands (Malvinas)">Falkland Islands (Malvinas)</option>

<option value="Faroe Islands">Faroe Islands</option>

<option value="Fiji">Fiji</option>

<option value="Finland">Finland</option>

<option value="French Guiana">French Guiana</option>

<option value="French Polynesia">French Polynesia</option>

<option value="French Southern Territories">French Southern Territories</option>

<option value="Gabon">Gabon</option>

<option value="Gambia">Gambia</option>

<option value="Georgia">Georgia</option>

<option value="Germany">Germany</option>

<option value="Ghana">Ghana</option>

<option value="Gibraltar">Gibraltar</option>

<option value="Greece">Greece</option>

<option value="Greenland">Greenland</option>

<option value="Grenada">Grenada</option>

<option value="Guadeloupe">Guadeloupe</option>

<option value="Guam">Guam</option>

<option value="Guatemala">Guatemala</option>

<option value="Guinea">Guinea</option>

<option value="Guinea-bissau">Guinea-bissau</option>

<option value="Guyana">Guyana</option>

<option value="Haiti">Haiti</option>

<option value="Heard Island and Mcdonald Islands">Heard Island and Mcdonald Islands</option>

<option value="Holy See (Vatican City State)">Holy See (Vatican City State)</option>

<option value="Honduras">Honduras</option>

<option value="Hong Kong">Hong Kong</option>

<option value="Hungary">Hungary</option>

<option value="Iceland">Iceland</option>

<option value="India">India</option>

<option value="Indonesia">Indonesia</option>

<option value="Iran, Islamic Republic of">Iran, Islamic Republic of</option>

<option value="Iraq">Iraq</option>

<option value="Ireland">Ireland</option>

<option value="Israel">Israel</option>

<option value="Italy">Italy</option>

<option value="Jamaica">Jamaica</option>

<option value="Japan">Japan</option>

<option value="Jordan">Jordan</option>

<option value="Kazakhstan">Kazakhstan</option>

<option value="Kenya">Kenya</option>

<option value="Kiribati">Kiribati</option>

<option value="Korea, Democratic People's Republic of">Korea, Democratic People's Republic of</option>

<option value="Korea, Republic of">Korea, Republic of</option>

<option value="Kuwait">Kuwait</option>

<option value="Kyrgyzstan">Kyrgyzstan</option>

<option value="Lao People's Democratic Republic">Lao People's Democratic Republic</option>

<option value="Latvia">Latvia</option>

<option value="Lebanon">Lebanon</option>

<option value="Lesotho">Lesotho</option>

<option value="Liberia">Liberia</option>

<option value="Libyan Arab Jamahiriya">Libyan Arab Jamahiriya</option>

<option value="Liechtenstein">Liechtenstein</option>

<option value="Lithuania">Lithuania</option>

<option value="Luxembourg">Luxembourg</option>

<option value="Macao">Macao</option>

<option value="Macedonia">Macedonia</option>

<option value="Madagascar">Madagascar</option>

<option value="Malawi">Malawi</option>

<option value="Malaysia">Malaysia</option>

<option value="Maldives">Maldives</option>

<option value="Mali">Mali</option>

<option value="Malta">Malta</option>

<option value="Marshall Islands">Marshall Islands</option>

<option value="Martinique">Martinique</option>

<option value="Mauritania">Mauritania</option>

<option value="Mauritius">Mauritius</option>

<option value="Mayotte">Mayotte</option>

<option value="Mexico">Mexico</option>

<option value="Micronesia, Federated States of">Micronesia, Federated States of</option>

<option value="Moldova, Republic of">Moldova, Republic of</option>

<option value="Monaco">Monaco</option>

<option value="Mongolia">Mongolia</option>

<option value="Montserrat">Montserrat</option>

<option value="Morocco">Morocco</option>

<option value="Mozambique">Mozambique</option>

<option value="Myanmar">Myanmar</option>

<option value="Namibia">Namibia</option>

<option value="Nauru">Nauru</option>

<option value="Nepal">Nepal</option>

<option value="Netherlands">Netherlands</option>

<option value="Netherlands Antilles">Netherlands Antilles</option>

<option value="New Caledonia">New Caledonia</option>

<option value="New Zealand">New Zealand</option>

<option value="Nicaragua">Nicaragua</option>

<option value="Niger">Niger</option>

<option value="Nigeria">Nigeria</option>

<option value="Niue">Niue</option>

<option value="Norfolk Island">Norfolk Island</option>

<option value="Northern Mariana Islands">Northern Mariana Islands</option>

<option value="Norway">Norway</option>

<option value="Oman">Oman</option>

<option value="Pakistan">Pakistan</option>

<option value="Palau">Palau</option>

<option value="Palestinian Territory, Occupied">Palestinian Territory, Occupied</option>

<option value="Panama">Panama</option>

<option value="Papua New Guinea">Papua New Guinea</option>

<option value="Paraguay">Paraguay</option>

<option value="Peru">Peru</option>

<option value="Philippines">Philippines</option>

<option value="Pitcairn">Pitcairn</option>

<option value="Poland">Poland</option>

<option value="Portugal">Portugal</option>

<option value="Puerto Rico">Puerto Rico</option>

<option value="Qatar">Qatar</option>

<option value="Reunion">Reunion</option>

<option value="Romania">Romania</option>

<option value="Russian Federation">Russian Federation</option>

<option value="Rwanda">Rwanda</option>

<option value="Saint Helena">Saint Helena</option>

<option value="Saint Kitts and Nevis">Saint Kitts and Nevis</option>

<option value="Saint Lucia">Saint Lucia</option>

<option value="Saint Pierre and Miquelon">Saint Pierre and Miquelon</option>

<option value="Saint Vincent and The Grenadines">Saint Vincent and The Grenadines</option>

<option value="Samoa">Samoa</option>

<option value="San Marino">San Marino</option>

<option value="Sao Tome and Principe">Sao Tome and Principe</option>

<option value="Saudi Arabia">Saudi Arabia</option>

<option value="Senegal">Senegal</option>

<option value="Serbia and Montenegro">Serbia and Montenegro</option>

<option value="Seychelles">Seychelles</option>

<option value="Sierra Leone">Sierra Leone</option>

<option value="Singapore">Singapore</option>

<option value="Slovakia">Slovakia</option>

<option value="Slovenia">Slovenia</option>

<option value="Solomon Islands">Solomon Islands</option>

<option value="Somalia">Somalia</option>

<option value="South Africa">South Africa</option>

<option value="South Georgia and The South Sandwich Islands">S. Georgia and The S. Sandwich I.</option>

<option value="Sri Lanka">Sri Lanka</option>

<option value="Sudan">Sudan</option>

<option value="Suriname">Suriname</option>

<option value="Svalbard and Jan Mayen">Svalbard and Jan Mayen</option>

<option value="Swaziland">Swaziland</option>

<option value="Sweden">Sweden</option>

<option value="Switzerland">Switzerland</option>

<option value="Syrian Arab Republic">Syrian Arab Republic</option>

<option value="Taiwan, Province of China">Taiwan, Province of China</option>

<option value="Tajikistan">Tajikistan</option>

<option value="Tanzania, United Republic of">Tanzania, United Republic of</option>

<option value="Thailand">Thailand</option>

<option value="Timor-leste">Timor-leste</option>

<option value="Togo">Togo</option>

<option value="Tokelau">Tokelau</option>

<option value="Tonga">Tonga</option>

<option value="Trinidad and Tobago">Trinidad and Tobago</option>

<option value="Tunisia">Tunisia</option>

<option value="Turkey">Turkey</option>

<option value="Turkmenistan">Turkmenistan</option>

<option value="Turks and Caicos Islands">Turks and Caicos Islands</option>

<option value="Tuvalu">Tuvalu</option>

<option value="Uganda">Uganda</option>

<option value="Ukraine">Ukraine</option>

<option value="United Arab Emirates">United Arab Emirates</option>

<option value="United States">United States</option>

<option value="United States Minor Outlying Islands">United States Minor Outlying Islands</option>

<option value="Uruguay">Uruguay</option>

<option value="Uzbekistan">Uzbekistan</option>

<option value="Vanuatu">Vanuatu</option>

<option value="Venezuela">Venezuela</option>

<option value="Viet Nam">Viet Nam</option>

<option value="Virgin Islands, British">Virgin Islands, British</option>

<option value="Virgin Islands, U.S.">Virgin Islands, U.S.</option>

<option value="Wallis and Futuna">Wallis and Futuna</option>

<option value="Western Sahara">Western Sahara</option>

<option value="Yemen">Yemen</option>

<option value="Zambia">Zambia</option>

<option value="Zimbabwe">Zimbabwe</option>

</select>

En ocasiones puede que queramos colocar un fondo a nuestros listados html <ul> <ol> hasta aquí sin problemas, pero si ademas queremos usar los números que nos proporciona el "ol" es necesario hacer algo al estilo:

ol {
    counter-reset:li; /* Initiate a counter */
    margin-left:0; /* Remove the default left margin */
    padding-left:0; /* Remove the default left padding */
}
ol > li {
    position:relative; /* Create a positioning context */
}
ol > li:before {
    content: counter(li);
    counter-increment: li;
    position: absolute;
    left: -1.5em;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 1.5em;
    padding: 4px;
    border-top: 2px solid #31759f;
    color: #fff;
    background: #31759f;
    border-bottom-left-radius: 2em;
    border-bottom-right-radius: 2em;
    border-top-left-radius: 2em;
    border-top-right-radius: 2em;
    font-weight: bold;
    font-size: 16pt;
    text-align: center;
}
li ol,
li ul {margin-top:6px;}
ol ol li:last-child {margin-bottom:0;}

Maquetación fija o liquida??

Hoy os planteo esta cuestión y de paso a ver si conseguimos abrir un poco debate para sacar conclusiones y aprender todos de todos.
Yo personalmente uso un mixto; es decir suelo dar un mínimo y un máximo de ancho y alto a mis diseños, pero después todo el contenido lo manejo mediante porcentajes; esta pregunta la abro a raíz de un desacuerdo en mi trabajo, puesto que uno de mis compañeros con el que estoy llevando a cabo un proyecto prefiere utilizar únicamente tamaños fijos en PX, vosotros como lo veis? Cual es vuestra opinión? que y como trabajáis día a día?

Un saludo a tod@s y que empiece la fiesta!!

Validación web Internet explorer

Seguramente todos los que alguna vez hemos programado algo para web nos hemos encontrado mil problemas al intentar hacerlo funcionar en todos los navegadores (si sabéis por donde voy, funciona en todos "safari, chrome, firefox..." pero en IE falla), pues bien dejando a un lado de momento las hojas de estilo css, voy a hablaros de un problema que me encontré este mismo viernes, al hacer una aplicación HTML5 con canvas y java Script.
La programo y pruebo en local, pruebo en todos los navegadores de verdad y funciona a la perfección  la pruebo en IE y sorpresa, ni carga, abro la consola de errores y me encuentro con que Internet Explorer 9 me dice que no reconoce addEventListener para los mas novatos en JS (yo me incluyo) Internet explorer hasta su versión 9 no incluía dicho método de JS, pero hacia lo mismo, o por lo menos a su modo con el método attachEvent sabemos lo especialito que es y lo que le gusta ponernos las cosas sencillas por lo que siempre teníamos que hacer un JS para IE y otro para el resto del mundo, o usar JQuery; pero parece que se están dando cuenta de que así no se va a ningún lado y lo están unificando por esta razón a partir de la versión 9 de IE lo han incluido; el caso, Internet explorer me decía que no lo reconocía  mi primera impresión fue, que bien... IE no soporta HTML5 y empece a googlear, había quien daba unos códigos JS que añadían funcionalidad a versiones antiguas de IE, pero que en la versión 9 y posteriores funcionaba HTML5, incluso leí que el W3C dice que IE9 es el que mejor soporta HTML5 con una tabla comparativa con el resto de navegadores.
Lo cual me dejo claro que mi aplicación debía correr en IE9 y empece abusar sobre ese error, aunque sin fortuna, pensé en cambiar el método por el de toda la vida de IE, pero lo usaba principalmente en una librería ajena, que aunque disponía del código abierto, era muy grande como para recorrermela entera y cambiarlo haciéndolo valido en todos los navegadores, pensé que si los fabricantes de la librería decían que eran validos para aplicaciones en HTML5 para todos los navegadores y tenían ejemplos sus ejemplos fallarían al igual que el mio, pero fue así  por lo que si sus aplicaciones funcionaban y la mía fallaba estaba claro que era un problema en mi código, me lo recorrí entero buscando errores, no vi nada del otro mundo, y menos que pudiera originar ese curioso error, ¿¿por que Internet explorer me decía que no reconocía un método que si debe reconocer?? Apunto de desistir pensando que seria algo de configuración de mi ordenador, le pedí a un compañero que lo probara, y os garantizo que no usa nunca el IE por lo que lo tenia por defecto, y también le fallaba a el, así que mi gozo en un pozo era fallo mio en la programación  seguí probando; en la consola de errores de IE (eso que los de Microsoft llaman herramientas de desarrollo, eso mismo que aparece al pulsar F12) vi que te dejan seleccionar distintos modos de compatibilidad, para emular distintos navegadores, probé todos los disponibles, IE9  IE8, IE7, vista de compatibilidad de IE9  pero con todos ellos el mismo error, al cabo de un rato de comerme la cabeza volví a comparar mi código con el de los ejemplos de los fabricantes de la librería, y me di cuenta que justo al lado de donde seleccionas el modo de navegador

en los ejemplos de los fabricantes salia como en la imagen superior, es decir, modo documentos estándares IE9, en mi aplicación, me salia NO ESTÁNDAR así que por fin encontré una diferencia!! el problema tenia que estar hay, cambie esa opción a estándares de IE9 y sorpresa!! mi aplicación empezó a correr, ahora solo tenia que encontrar el modo de que eso me saliera por defecto, algún tipo de configuración debía haber para decirle a IE que cumplía sus estándares  o por lo menos que intentaba cumplirlos, una vez mas revise el código de ejemplo de esta gente, y no encontré nada, al cabo de un rato en la misma herramienta para desarrolladores cerré todos los nodos del código de mi aplicación e hice lo propio con el de la aplicación de ejemplo, vi una pequeña diferencia, ellos tenían una linea mas encima de todo el código de la aplicación la cual yo no tenia la puse y premio!! todo funcionando.

--SOLUCIÓN--

Esa linea es ni mas ni menos que <!DOCTYPE html> al copiar el código de la estructura principal de la web o no se en que momento, debí de eliminarlo accidentalmente  pero gracias a ello se que si no lo pones IE hace cosas raras, mientras que el resto de navegadores se comporta como si si estuviera, creo que no se me volverá a olvidar copiarlo, espero que esto le sirva a alguien que se olvide de escribirlo, o cometa el error de eliminarlo accidentalmente

Dejar una capa siempre visible

En esta ocasión voy a explicar como dejar una capa o un div siempre visible en la web; es decir que al hacer scroll esa capa no se mueva esto puede hacerse para dejar siempre visible nuestro logo, o como en facebook, tuenti y muchas otras paginas, para dejar siempre visible el chat, en fin que los usos son tantos como limites tenga nuestra imaginación.

En la hoja de estilos tan solo deberemos escribir el siguiente código:

    position: fixed;
debiendo tanbién decirle donde queremos que aparezca claro esta, podemos teclear algo como lo siguiente

    left: 0px;
    top:0px;
para que aparezca en la esquina superior izquierda, podemos darle porcentajes, usar PT; al fin y al cabo es solo una etiqueta css mas.

Espero que os sea útil ;)