Skip to content

Instantly share code, notes, and snippets.

View druellan's full-sized avatar

Dario Ruellan druellan

View GitHub Profile
### Keybase proof
I hereby claim:
* I am druellan on github.
* I am druellan (https://keybase.io/druellan) on keybase.
* I have a public key whose fingerprint is 17CC 5A20 2F75 610F BB0F 57A2 9D7F 54F3 5705 DDD3
To claim this, I am signing this object:
@druellan
druellan / wp_url_links.php
Created August 24, 2017 20:28
WP URL Links
@druellan
druellan / wp_get_current_url.php
Created July 13, 2017 12:52
WordPress get current URL
/**
* There is no method of getting the current URL in WordPress.
* Various snippets published on the Web use a combination of home_url and add_query_arg.
* However, none of them work when WordPress is installed in a subfolder.
* The method below looks valid. There is a theoretical chance of HTTP_HOST tampered, etc.
* However, the same line of code is used by the WordPress core, for example in
* @see wp_admin_canonical_url
* so we are going to use it, too
* *
* Note that #hash is always lost because it's a client-side parameter.
@druellan
druellan / html5_responsive_sourceset
Created June 12, 2017 15:17
HTML5 Responsive Sourceset
<img src="foo.jpg" alt="Bar" srcset="foo@2x.jpg 2x, foo.jpg 1x">
<picture>
<source media="(min-width: 1024px)" srcset="foo-large.jpg 1024w, foo-medium.jpg 640w, foo-small.jpg 320w" sizes="50vw">
<source srcset="foo@2x.jpg 2x, foo.jpg 1x">
<img src="foo.jpg" alt="Bar">
</picture>
@druellan
druellan / wp_picture_sourceset.php
Created May 18, 2017 13:27
WordPress Picture source set
<?php
$img_src = wp_get_attachment_image_url($picture, 'medium');
$img_srcset = wp_get_attachment_image_srcset($picture);
?>
<picture>
<img src="<?php echo esc_url($img_src); ?>" srcset="<?php echo esc_attr($img_srcset); ?>">
</picture>
@druellan
druellan / picture_element_snippet.html
Created May 18, 2017 12:25
HTML5 Picture Element
<picture>
<source srcset='large.webp' media='(min-width: 992px)' type='image/webp'>
<source srcset='large.jpg' media='(min-width: 992px)' type='image/jpeg'>
<img src='small.jpg' alt=''>
</picture>
@druellan
druellan / html5_base_head.html
Last active May 18, 2017 21:19
HTML5 Base Head
<!doctype html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<!-- For IE 9 and below. ICO should be 32x32 pixels in size -->
<!--[if IE]><link rel="shortcut icon" href="path/to/favicon.ico"><![endif]-->
@druellan
druellan / festival_schema.html
Last active May 18, 2017 12:00
Schema.org Type festival
<div itemscope itemtype="http://schema.org/Festival">
<a href="http://www.woodstocklive.co.uk/" itemprop="url">
<h2 itemprop="name">Woodstock Music &amp; Art Fair</h2>
</a>
<img src="http://upload.wikimedia.org/wikipedia/en/b/b7/Woodstock_poster.jpg" alt="Woodstock poster 1969" itemprop="image"/>
<p itemprop="description">
The Woodstock Music &amp; Art Fair (informally, Woodstock or the Woodstock Festival) was a music festival,
billed as <em>An Aquarian Exposition: 3 Days of Peace &amp; Music</em>. It was held at Max Yasgur's dairy farm in the Catskills
near the hamlet of White Lake in the town of Bethel.
</p>
@druellan
druellan / googlefacebooktwitter.template.html
Created December 29, 2015 17:18
Basic template for Google Plus + Twitter Cards + Facebook (simplified metadata)
<html prefix="og: http://ogp.me/ns#">
<head>
<title>The Title</title> <!-- ˜60 chars -->
<meta name="description" content="The Description"> <!-- ˜150 chars -->
<meta property="og:title" content="The Title">
<meta property="og:description" content="The Description"> <!-- ˜300 chars -->
<meta property="og:site_name" content="Sfida Blog">
<meta property="og:locale" content="es_AR">
<meta property="og:type" content="website">
<meta property="og:url" content="http://www.sfidastudios.com">
@druellan
druellan / googleplus.template.html
Last active December 29, 2015 17:12
Basic template for Google Plus (Schema.org/HTML5 metadata)
<html itemscope itemtype="http://schema.org/Article">
<head>
<title>The Title</title> <!-- ˜60 chars -->
<meta name="description" content="The Description"> <!-- ˜150 chars -->
<link rel="publisher" href=”https://plus.google.com/+sfidastudios">
<meta itemprop="name" content="The Title">
<meta itemprop="description" content="The Description">
<meta itemprop="image" content="http://www.example.com/image.jpg">
</head>
</html>