List Code
Testing Playwrite on for Node
I came across this library on y news, and thought id give it a bit of a test. I managed to get it working but not really sure what tests it can do. I set it to take a screen shot of a we..
add an outline to everything!
very handy for checking elements and other things on your page. this one line will add an outline to every element, so you can see where all the elements are located.
content editable p tag with spell check enabled
im not sure how this is useful, but you can set a p element to content editable so you can change its contents and then also set the spellcheck to true so the browser knows that it should run its spel..
card.html template
a card template with title, content and a mb-3 for bottom margin for usage with the php template system.
making the search page nicer
Sometimes i dont even notice things like this, as i look at them all day and go, ah yeah thats a search box. I forget that all these things can be fixed. Anyway, even just adding this form to a..
function to delete older sqlite records when the limit is reached
I had an issue where a sqlite database was hitting over 100,000 records and this was causing quite a lot of lag and crashing on my server, the number of records was not really meant to be this high, s..
fixing error Call to undefined function simplexml_load_string
usually the error "Call to undefined function simplexml_load_string" happens when the php xml library is missing from your server. You can install the xml php library with the following command, repl..
loop to arr.length or array length
showing a simple loop that uses the length of the array to find the end of the loop. This just console logs each item in the array and stops the loop when it gets to the end of the array.
bootstrap form basic
a nice simple bootstrap form layout example template
get directions from google maps form embed
this is a random form that posts back to google maps showing the directions needed to get from one address to another location, im not sure where this would be usefull. Maybe on a site where you neede..
center image preview with lightbox and caption
I just wanted a thumbnail or preview of the image, where if clicked it would load into a lightbox, but the preview just shows the center of whatever image is added to it. Note: I just picked ra..
get tomorrows date with javascript
Same as the get yesterdays date except with a +1 rather than a -1 let tomorrow = new Date(new Date().setDate(new Date().getDate()+1));
get yesterdays date with javascript
This gets todays date and minuses one day from it to be ... yesterday. let yesterday = new Date(new Date().setDate(new Date().getDate()-1));console.log(yesterday); This format is the full da..
hide the first h3 tag on the page with css
in case you want to target the first item on a page and hide it or change it with css.
make a nice readable date using a timestamp string function make_nice_date
handy if you have a timestamp like this: 2022-01-10 00:12:42 and want it to look a bit nicer. like this... 12:19 am, January 10, 2022
add new random image with button
this appends a new random image from picsum.photos to the div with the id app
Create Strings using Template Literals
if you use the backtick to enclose your strings you no longer have to use \n for a new line. For example: `this is a multiline ...string!!` Console Example
get the content of a url get the content of a link with php and test if the result is empty
Where $import_url is the target URL.
extract meta attributes with simple html dom
pass in the url as import_url and it will search for the meta keywords tag and echo the result.
php check if url is valid with filter_var
check if url is valid using filter_var and return a message if the url is invalid rather than continuing
Common and Uncommon Meta Tag's and Social Meta Tags
I am writing an api that checks for meta tags so i thought i would add a list here of some of the common meta tag names that i found. The ones prefixed with og: are facebook and linked in and s..
Darkmode JS - Add darkmode to your site with one script
This library looks really nice! It drops in ok, but maybe with more complex layouts or coloring, it seems to break a little bit. Darkmode JS Example Source Links https://darkmodejs.learn.un..
Use destructuring assignment within the argument to the function half to send only max and min inside the function.
this seems like a tricky one, can be resolved with removing the stats array reference. Im not sure how it still knows to access the stats array. I dont know how that is correct as the console just lo..
center align vertical 2 items in a container flex
i had this issue and i was pretty sure that flex center could fix it but it was causing the two items in the div to sit next to each other, which was annoying as it was a header and content, but i sti..
simple javascript no library accordion
a simple button and div based accordion with a toggled indicator
Using Destructuring and the Rest Parameter to Reassign Array Elements
Use destructuring assignment with the rest parameter to perform an effective Array.prototype.slice() so that arr is a sub-array of the original array source with the firs..
Use destructuring assignment to swap the values of a and b
Use destructuring assignment to swap the values of a and b so that a receives the value stored in b, and b receives the value stored in a. I was havi..
Hello world in C and seeing what it is actually doing
One of the most simple C applications, how to compile it and how to objdump it. C #include int main() { int i; for(i=0;i < 10; i++) { puts("Hello Mac\n"); } return ..
How to download music to mp3 format from youtube using youtube-dl
How to download ABGT from youtube. youtube-dl sudo apt install python3-pip ffmpeg brew install ffmpeg brew install youtube-dl Getting this error: The operation couldn’t be completed. Un..
Sweet Alert 2 Methods and Examples
I love this alert replacement so i thought i would just add some of the examples here to show how awesome it is! You can check out the official sweet alert documents here if you want to browse throug..
Using CSS Grid instead of Float's for a 3 column simple list
I have been in the habit of just using float:left and then width 31% with margin 1% for list items, and it seems to work fine usually. But i thought i probably should update the defaults in by ..
How to Assign the Value of One Variable to Another in Javascript
Showing a very basic script that assigns the value of the variable a to b and then console log's the object.
Slick Slider Carousel with Custom Next and Prev Buttons
I had a slider the other day where i needed to attach some detached buttons, so added the following click events to control the next and previous events on the slider. Note the class names: sli..
Input Suggestions using a datalist
I found this cool piece of code here, looks very handy. Basically you can add the input and then provide it a data list with suggestions, which then will allow you to start typing the item and it wil..
get php to validate its self with php check syntax
Did you know that php has a syntax checking function built into it? Well it does and this is how you can use it to check your php files for errors, rather than just running them and hoping for the be..
Console Tips and Tricks
Here are some quick commands for the console. Getting to the console in your browser Press F12 and Find the console tab. That little blue > there is the console. this is in brave or chrome, bu..
how to copy the folder path in finder
Moving from windows to mac is quite a shock, especially when you go from explorer which shows the file and folder path on every window in file explorer. Then we go to mac finder, which is nice, but h..
Spam IP Database and delete button
The Background and Reason for the SPAM IP Database and Delete I actually wrote up half of this article and was still testing the function and lost the whole post, which will teach me for adding it st..
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.
Add custom symbol to ul li list and align text items
Pick a symbol from here. Then you can copy and paste it into the following css to change the list symbol, for more unique looking list items. If the list items dont align correctly you will nee..
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..
php export csv from string to browser download
exports an array to a csv string and returns the result in the browser
how to embed google fonts icons
For some reason when i go to embed a google font icon, they dont seems to have any obvious way to actually use it, i can find the icons ok here. But then when i go and use it it links to a how to embe..
convert json string to a php array
takes a json string in php and converts it into a php array using the json_decode function.
how to decode xml in php
how to decode xml into an array in php Here is a full example taking an xml string and converting it into a php array.
button zoom effect with expanding background
Just playing around with zoom and background size effects on a promo button, if you change the background to 110% and then zoom to 1.1 you can see how the background appears to zoom out while the butt..
count total results from distinct sqlite
a query to count the total items found on a distinct query