How to send a message to Google

Why is so hard to contact Google?

Well, I’m sure I’m not the first one trying to communicate something with Google, as when you dig in the help pages you only get infinite levels of FAQ sections where you can’t actually write anything to them. I had some special problems with my Gmail account, so any of the FAQ were helpful in my case.

screen-shot-2016-10-10-at-11-30-35-am

Yup, a bit hard…

 

 

Lucky for me, I found today a ‘Send Feedback’ fairly easy to reach. I got a couple of screenshots to make this easier to write and read 😉

 

1 – Click in the gear icon to open the settings and click ‘Help’


screen-shot-2016-10-10-at-11-15-38-am

 

2 – In the newly opened window, go and click ‘Send feedback’


screen-shot-2016-10-10-at-11-16-53-am

 

3 – Here you can even attach a screenshot to explain better your problem.


screen-shot-2016-10-10-at-11-31-10-am


Country detection via PHP

Imagine a example.com with some example.com/es, example.com/fr with content related to each country. One solution is a javascript-based country detector that could ask the visitor to change the current site to the most appropriate one regarding to the visitors origin. The problem with this solution is that the user needs to load the content twice, and is not a very good experience.

With a index.php-based PHP country detection we can use a fast external API to determine the visitors country and redirect to the specific location, and if no country is detected, redirect it to a default site.

Well, for this job we could use ipinfo.io, this website offers a very fast and free API (with limits, but if you are going to use in a small-medium site is enought) that returns all the data in JSON.


Roman numeral HTML entities

Many times, as a style condition, we need to use roman numeral symbols in a website, and is common to write them with normal characters like I, V and so. This is a problem from the SEO perspective, as google is seeing that as a VI, not as a 6th to give you an example.

In order to use them in a website, use the following HTML entity numbers:

  • Ⅰ: Ⅰ
  • Ⅱ: Ⅱ
  • Ⅲ: Ⅲ
  • Ⅳ: Ⅳ
  • Ⅴ: Ⅴ
  • Ⅵ: Ⅵ
  • Ⅶ: Ⅶ
  • Ⅷ: Ⅷ
  • Ⅸ: Ⅸ
  • Ⅹ: Ⅹ
  • Ⅺ: Ⅺ
  • Ⅻ: Ⅻ
  • Ⅼ: Ⅼ
  • Ⅽ: Ⅽ
  • Ⅾ: Ⅾ
  • Ⅿ: Ⅿ
  • ⅰ: ⅰ
  • ⅱ: ⅱ
  • ⅲ: ⅲ
  • ⅳ: ⅳ
  • ⅴ: ⅴ
  • ⅵ: ⅵ
  • ⅶ: ⅶ
  • ⅷ: ⅷ
  • ⅸ: ⅸ
  • ⅹ: ⅹ
  • ⅺ: ⅺ
  • ⅻ: ⅻ
  • ⅼ: ⅼ
  • ⅽ: ⅽ
  • ⅾ: ⅾ
  • ⅿ: ⅿ

 


Basic flexbox structure

Flexbox! That thing, everyone talks about that but anyone actually knows how to handle it =P

Well, I’m not the most expert in flexbox, but I have some experience dealing with it. As usual, I’m not going to give a big explanation about this, but instead I’m leaving here a piece of code ready to use that is going to help you to start with flexbox, a basic structure as a basic working example. Copy & paste!!

 


How to create a Template in WordPress without FTP Access

You want to create a Template in your theme, and somehow you don’t have FTP access in that moment. But, hey, you have the WordPress logins to enter in the backend, so… stay tuned!

1 Indentify the theme directory

To know the directory in which the theme is located, you will need to see the source code in the homepage of your website and search “/wp-content/themes/“. The search will show you the full path to your theme, would be something like “http://example.com/wp-content/themes/YOUR_THEME/style.css” or whatever.

We only need to copy “/wp-content/themes/YOUR_THEME/” to the clipboard.

2 Create the File

In your WordPress backend, go to Appearance > Editor, open “header.php” and paste the following code into it:

Of course, you need to modify the path with your specific needs.

Now, go to your homepage and go back to the backend to delete the line you just wrote.

3 Edit the File

Like magic, the file now will appear in the right side of the editor. So now you can edit it to create a new and fresh template!


Script to make paged online tests with jQuery and Bootstrap

Ok, you want know if you are a positive or negative person. Or maybe you want to know if your death is close. Or you just want a personality test. Anyway, you are here because you need to build an online test to see results. Here you’ll learn how to write a paged testing system with jQuery.

Screen Shot 2015-09-07 at 11.41.10 am

As always, I’ll drop all the code here of a working example for you to read and learn:

index.php

 

styles.css

 

main.js

 

And thats it! Now you can download the attached ZIP and play!


Manually create a single WordPress installation from a Multisite subsite

This post was made after a very intense session of 6 hours trying, without luck, to export a site using the WordPress tools and plugins. So I decided to do it manually like a real man.

Well, now follow the steps below to extract a subsite from a Multisite Installation:

1 – Identifying the subsite

  1. Go to your WordPress network admin dashboard (http://example.com/wp-admin/network).
  2. Go to ‘Sites‘.
  3. Click in the site you want to export.
  4. See the URL in your browser (http://example.com/wp-admin/network/site-info.php?id=3).

site_id

The site ID is 3.

2 – Export the database

  1. Install the plugin ‘Adminer‘.
  2. Go to ‘Tools » Adminer‘.
  3. Click in ‘Start Adminer inside‘.
  4. Go to ‘Export‘.
  5. Deselect all the tables and select only the ones starting with ‘wp_3_‘.
  6. Select ‘wp_usermeta‘ and ‘wp_users‘.
  7. Click in the button ‘Export‘.

export_site

adminer_2

3 – Edit the *.sql file

  1. Open the downloaded sql file with your favourite code editor.
  2. Find and replace ‘/uploads/sites/3/‘ with ‘/uploads/‘.
  3. Find and replace the URL of the old subsite with the new URL for the single site.
  4. If you think you need to find and replace something else to fit your new installation, this is the moment.

 

4 – Upload the *.sql file

  1. Create a new database in your server as usual for a new WordPress site.
  2. Import the modified sql of the last stage.
  3. Perform this SQL Query » https://gist.github.com/aprea/484539cfea18e253bc2a

 

5 – Prepare the file structure for the new site

  1. Download and copy the files for a new WordPress installation.
  2. Copy all the plugins and themes folders from the Multisite to the new site.
  3. Copy ‘/wp-content/uploads/sites/3‘ to ‘/wp-content/uploads‘ in the new site.

 

6 – Et voilà!

  1. Enter in your new site dashboard and check everything works good.
  2. Finished!

RSCSS

RSCSS

Reasonable System for CSS Stylesheet Structure.

 

Introduction

Any CSS greater than 1000 lines will get unwieldy. You’ll eventually run into these common pitfalls:

  • “What does this class mean?”
  • “Is this class still being used?”
  • “If I make a new class green, will there be a clash?”

rscss is an attempt to make sense of all these. It is not a framework. It’s simply a set of ideas to guide your process of building maintainable CSS for any modern website or application.

 

  • Think in components, named with 2 words (.screenshot-image)
  • Components have elements, named with 1 word (.blog-post .title)
  • Name variants with a dash prefix (.shop-banner.-with-icon)
  • Components can nest
  • Remember you can extend to make things simple

Controlando un LED con un LDR en Arduino

Esto es un ejemplo muy básico a la hora de empezar con Arduino. Aglutina, en pocas líneas, todo lo que necesitas para empezar con fuerza en este mundillo.

En este ejemplo haremos un programa que enciende el LED 13 (el integrado en placa), lee un sensor de luz (un LDR) conectado al pin A5 y enciende un LED conectado al pin 3 con una intensidad inversamente proporcional a la intensidad que reporte el sensor (cuanta más luz ambiental, menos brilla el LED), que se actualiza cada 50 milisegundos, prácticamente a tiempo real. Además, dejamos configurado el puerto serie para ver, en el ordenador, el valor de entrada del sensor de luz (de 0 a 1023).

En este ejemplo ponemos en práctica los siguientes conceptos:

  • Realizar un montaje básico
  • Definir variables
  • Escribir un pin en digital.
  • Escribir un pin en analógico.
  • Leer un sensor
  • Abrir y leer un puerto serie

Bien, antes de comenzar, repasamos los materiales que vamos a necesitar para el montaje básico:

  1. Arduino UNO (o compatible)
  2. Protoboard o Breadboard
  3. Diodo LED de 5mm y 20mA
  4. Resistencia de 220Ω (conectado al ánodo del LED)
  5. Resistencia de 10KΩ (conectado al LDR)
  6. Sensor de luz LDR
  7. Juego de cables
Cableado del ejemplo

Esquema del cableado para este ejemplo

Tras montar el circuito del sistema, procedemos a escribir el programa que cargaremos con el Software de Arduino. Para ello, puedes copiar y pegar el siguiente ejemplo:

Como vemos, el programa se divide en 3 partes. En la primera definimos las variables, en la segunda configuramos el programa y en la tercera ejecutamos el bucle que es en sí mismo el programa.

¡Disfrutad!


Bootstrap basic structure

Here it is, a basic-as-hell Bootstrap 3 example without javascript, only HTML and CSS to start quickly any simple site: