Search
Search Code
Search Code by entering your search text above.
css
flip card animation 3d front and back css html

3d flipping card with front and back content and animation

11:15 pm, February 15, 2024
sections
html and css hoizontal simple timeline section in foundation

a horizontal simple timeline section example done in foundation grid with some custom styles. This also uses the Lato Font quick install! So Quick!..  :P Also works on responsive and mobile dev..

3:33 am, March 29, 2022
pi400
pi400 how to take a screen shot

This is actually built in, well if you have scrot installed anyway. Which it already was for me. Press Print Screen button and it saves it into your home folder.

6:40 am, November 20, 2021
mac
install cmatrix on mac m1

For some reason i thought the mac would have apt or apt-get to install packages, but apparently not.  Here is how you can install cmatrix a matrix emulator or other unix type terminal apps on ma..

2:31 am, November 19, 2021
site bugs
Changing the default hero image based on the category name [not yet done]

This is more of a todo item, at the moment the hero image uses the same image for every post unless a hero is specified for each, i would also like to set the default image per category so if the post..

3:36 am, October 14, 2021
ideas
Idea: Google Font Dropdown Selector Code

just an idea at the moment, a dropdown list of google fonts and when selected it loads that selected font using the @import css tag.  Loading the fonts Gist : not tested https://gist.github.com..

8:55 am, October 6, 2021
html
twitter social sharing meta tags

I had done this one so many times on client sites I actually forgot that i had not applied it to my own site! Doh! Anyway this is the tag setup i use for adding the title, url, author and featured im..

11:51 am, October 5, 2021
sections
responsive three box section with tabular data or table data

here is a section in foundation with 3 hero boxes with images on top, and then a title and some tabular (is that the same as table?) data in each box, so could be good for some kinda products and then..

5:50 am, October 1, 2021
wordpress
wordpress add a template file to your theme

this is the basic layout of adding a wordpress template php file to your wordpress theme. good for custom theme pages This is a really basic template with just the header, but once added wordpress w..

1:13 am, September 28, 2021
css
404 Error Page Codepen

found this in my links the other day, still looks cool...

1:16 am, July 16, 2021
site documentation
use a list group for listing by category page [todo]

change this to a list group, should make it neater. Page to update: https://kruxor.com/list-category/code/  so for some reason this is listed using this function PHP $list_wiki_menu = $clas..

12:02 am, June 17, 2021
site documentation
hero widget header - creates a nice looking hero item from a target uid and class

this creates a "nice" looking hero widget, just wanted to create something that looked decent and had an attached background image, surprizingly annoying to link items together. For some reason i kee..

12:10 am, June 11, 2021
javascript
prevent default click event on link

This will prevent the default event on a link url, so for example if you have a <a href="">link</a> link this code will prevent it from loading the href link when clicked and you can do so..

1:59 am, June 8, 2021
php
php basic page router

this php page router while pretty basic does the job for this site. it takes all the query string and splits it with the / into $p variables you will also need the following nginx or similar page rew..

12:29 am, April 4, 2021
css
adding background blur to an image using css fill screen

I had noticed this cool looking effect used on places like google, and other sites that display portrait images, i think i saw it on the google home as well or maybe google photos.  Its basicall..

5:23 am, February 19, 2021
design elements
hero box with title sub title logos and call to action buttons

Here is a basic hero box section that contains: Title Sub Title 6 Logos (could replace with carousel logos) 2 call to action buttons I think it can be made more responsive, by replacing the..

2:43 am, November 9, 2020
wordpress
getting the site title vs the page name

this statement will check if the current page is the home page and show the get_bloginfo('name') if its another page in the site it will get that pages title using wp_title('')

5:07 am, June 16, 2020
wordpress
wordpress get home url

this uses the global wordpress variable to retrieve the home url

5:03 am, June 16, 2020
css
Drop Down Menu Swapping Left align to Right

this is useful if you have a nav that hits the right side of the screen and you want it to open on the left rather than the right side. you can see on the very right drop down item opens with its item..

5:36 am, June 26, 2019
wordpress
wordpress change domain in config, wordpress domain config

When moving wordpress sites around the place its usually easiest to change the domain like this. add these to your wp-config.php file define('WP_HOME','http://newsite.com'); define('WP_SITEURL','ht..

6:20 am, August 31, 2018
php
file get contents reads entire file into a string

you can use the file_get_contents function to read a file or a web address usage get a url content $homepage = file_get_contents('http://www.example.com/'); echo $homepage; get a file con..

6:20 am, August 31, 2018
wordpress
wordpress check home and not home for banners and things

this quick function will check if the page is home or not good if you want something on the other pages and something just on the home page in the header or that kind of thing. i have tested this i..

6:20 am, August 31, 2018
html
simple dropdown multi level navigation ul li css

updated to work standalone and not effect other list elements on the page

6:20 am, August 31, 2018
html
layout homepage

just some experiments external link

6:20 am, August 31, 2018
css
set transparent menu over background image

this is probably obvious, but i found it useful for those themes that look nice with a semi-transparent header sitting over the top of an image. I think ill do this as an external example, as its eas..

6:20 am, August 31, 2018
Welcome

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it. more...

Subscribe to weekly updates about things i have added to the site or thought interesting during the last week.

You could also follow me on twitter or not... does anyone even use twitter anymore?

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕

❤️👩‍💻🎮

🪦 2000 - 16 Oct 2022 - Boots
Random Quote
"Let us prepare our minds as if we'd come to the very end of life. Let us postpone nothing. Let us balance life's books each day ... The one who puts the finishing touches on their life each day is never short of time."
Seneca
Random CSS Property

border-block-end-width

The border-block-end-width CSS property defines the width of the logical block-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.
border-block-end-width css reference