WordPress: ACF & qTranslate [solución] conflicto Editor Wysiwyg

Si usáis estos 2 plugins (Advanced Custom Fields y qTranslate) conjuntamente es probable que tengáis problemas al usar el campo “Wysiwyg” de ACF, ya que duplica el texto del último campo Wysiwyg en el Content del post/página.

Esto pasa por un conflito del qTranslate con ACF. Para solucionarlo, prueba a editar el archivo “qtranslate_javascript.php” del plugin qtranslate:

1. Busca la línea (línea 288 aprox.):

qtrans_save(switchEditors.pre_wpautop(o.content));

Y reemplázala por:

if (ed.id.match(/^qtrans_/)) { qtrans_save(switchEditors.pre_wpautop(e.content)); }

2. Busca la línea (línea 334 aprox.):

id = id || 'qtrans_textarea_content';

Y reemplázala por:

window.id = id || 'qtrans_textarea_content';

pd: lo acabo de testear también con mqTranslate 2.6.3 y Advanced Custom Fields 4.3.8.

jQuery: cambiar el ancho o alto de un elemento

Algo muy básico como cambiar los valores de anchura o altura de un o varios elementos usando el método css de jQuery.

Por ej. tenemos un determinado elemento con unas dimensiones (100×100) en css:

<div style="height: 100px; width: 100px; background:red" id="elemento"></div>

Vamos a cambiar esas dimensiones por otras (600×900):

$(document).ready(function() {
    $('#elemento').css({ 'width':'600px', 'height':'900px' });
});

Html Links “Share” de las Redes Sociales más populares

Códigos html para insertar los enlaces para compartir “a pelo” de las principales redes sociales (Twitter, Facebook, Google+, Digg, Reddit, Linkedin, Pinterest, StumbleUpon) directamente desde el href, sin cargar las librerías de cada uno.

<!-- Twitter -->
<a href="http://twitter.com/share?url=http://www.bufa.es&amp;text=Bufa Webmaster" target="_blank">Twitter</a>
<!-- Facebook -->
<a href="http://www.facebook.com/sharer.php?u=http://www.bufa.es" target="_blank">Facebook</a>
<!-- Google+ -->
<a href="https://plus.google.com/share?url=http://www.bufa.es" target="_blank">Google+</a>
<!-- Digg -->
<a href="http://www.digg.com/submit?url=http://www.bufa.es" target="_blank">Digg</a>
<!-- Reddit -->
<a href="http://reddit.com/submit?url=http://www.bufa.es&amp;title=Bufa Webmaster" target="_blank">Reddit</a>
<!-- Linkedin -->
<a href="http://www.linkedin.com/shareArticle?mini=true&url=http://www.bufa.es" target="_blank">Linkedin</a>
<!-- Pinterest -->
<a href="http://pinterest.com/pin/create/button/?url=http://www.bufa.es&amp;description=Bufa Webmaster&amp;media=http://www.bufa.es/wp-content/themes/bufa/images/thumbnail_bufa_default.png">Pinterest</a>
<!-- StumbleUpon-->
<a href="http://www.stumbleupon.com/submit?url=http://www.bufa.es&title=Bufa Webmaster" target="_blank">StumbleUpon</a>

(*) A partir de aquí ya podéis customizarlo a vuestro gusto en diseño y demás…, por ejemplo yo suelo utilizar un popup centrado al abrir cada link (en lugar de que habrán en ventana nueva).

CSS: Responsive de videos Youtube y Vimeo

La forma más sencilla de hacer responsive los vídeos de youtube o vimeo en nuestras webs con CSS. Basta con insertar el iframe dentro de un elemento contenedor con las siguientes 2 clases css:

.video-responsive {
    position: relative;
    margin-bottom: 20px;
    padding-top: 56.25%;
}
.video-responsive iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

pd: el porcentaje de 56.25% sale del aspecto 16:9 = (9/16)*100

Ejemplo de vídeo responsive de Vimeo:

<div class="video-responsive">
    <iframe src="//player.vimeo.com/video/17798583" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen width="500" height="281"></iframe>
</div>

Ejemplo de vídeo responsive de Youtube:

<div class="video-responsive">
    <iframe src="//www.youtube.com/embed/TKbOywKH8ws" frameborder="0" allowfullscreen width="560" height="315"></iframe>
</div>

PHP: calcular espacio disponible del servidor

La función disk_free_space() de php devuelve el espacio disponible (en bytes) de un directorio que le pasamos como parámetro.

A continuación un ejemplo de uso, mostrando el resultado en MB:

$bytes = disk_free_space("/");
$base = 1024;
$libre = ($bytes/$base)/$base; // en MB
echo $libre.' MB<br>'; // Imprime por ej: 54477.0546875 MB

Puedes editar la variable $libre para obtener el resultado en el valor que necesites sabiendo que 1024 bytes = 1 KB, etc…