Tweaked my expires headers

I’m adding this to my .htaccess file at the moment:

# Enable expirations
ExpiresActive On 
# Default directive
ExpiresDefault "access plus 1 month"
# Favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
# PDF
ExpiresByType application/pdf "access plus 1 year"
# CSS
# ExpiresByType text/css "access plus 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"

Old Enough for Nostalgia

Just thought I’d document what I’ve been reading recently because I’m starting to see a theme here. It’s not a technical Today I Learned, but these articles are making me think about how I see websites and also how my ideas on that have changed.

Read more

Styling placeholder text

Not something new I learned, more something I keep forgetting over and over.

::placeholder to change how placeholders look. You’d think I’d remember something so obvious…
If it’s not working, this post over at CSS-Tricks may have some more information on why.

(Actually, what that post taught me, is that there is a difference between pseudo elements and pseudo classes!)


Solving hashes-x.x.x.php missing

I had to clean up a hacked WordPress site recently and one of the steps I took was to scan the entire site with Automattic’s Exploit Scanner.

It needs a hash file for the version of WP you’re scanning and since it hasn’t been updated in 2 years or so, it doesn’t have them. WordPress has had several security updates since, so the plugin doesn’t even have the hash files for older versions of WP. This is easy enough to solve since the plugin itself comes with a hashes-generator.php.

Read more

Hooray for text-decoration: underline!

For years the first thing I would do on a new project is add a { text-decoration: none; } in some form or other to the styling of any website. However I was going to make links look, I was not leaving that offensive-looking text-decoration:underline; in place.

But text-decoration is growing up and browser support for the new options is improving, including, for example, the increased support in the recent release of Firefox 70.

My favorite feature is that underline can skip glyphs now, if you want! Followed almost immediately by my second favorite feature: text-underline-offset: <length>; There are more options than just <length>, read more on text-underline-offset here at MDN web docs. Between these two text-decoration: underline; can actually look classy.

Unfortunately, support for text-underline-offset is even less: Firefox and Safari at the moment. Glyph skipping specifically is supported much better with text-decoration-skip-ink in Firefox, Chrome and Opera. And most browsers now support a shorthand version of text-decoration which can also set color. Lovely!

Read more about all of it at MDN web docs.


:last-of-type but only if it meets other conditions as well

.gallery-item:nth-of-type(3n+2):last-of-type

I was working on a gallery with rows of 3 items per row for which the markup contained <br> after every third .gallery-item and the CSS used floats. It didn’t look how I wanted it to and needed to change it anyway, so I decided to also get rid of the floats and break-tags and use display: flex instead.

Read more

Transition on hover

What: If you put a transition on the :hover instead of on the :link, it only transitions one way. If you put the transition on the :link, it will transition each way. Usually this is exactly what you want because once you move the cursor off the link, the effect will be gradually transitioned back instead of being removed abruptly.


Shortcode & Autop

I have a little WordPress plugin I use on some of my sites and it employs shortcodes. The shortcodes are not self-closing and they are wrapped in more shortcodes. They’re nested shortcodes. Using them looks like this:

[ltabjes talen="Taal Language"][ltab taal="Taal"]

Content

[/ltab][ltab taal="Language"]

More content

[/ltab][/ltabjes]

WordPress wraps p-tags around each of these shortcode tags, and adds more p-tags inside the shortcodes, adding more space than is wanted. All those empty p-tags are a drag. The shortcode_unautop function removes the outer paragraph tags, but not the inner ones. I don’t want to remove wpautop altogether because the content in the shortcode might still need it. How to solve this?

Read more