Here’s a simple code example of how you can have separate blog roll areas on your WordPress website which show different types of blog content. Just add this query to your template file:
<?php
$query = new WP_Query(array('category_name' => 'reviews'));
if ($query->have_posts()): while ($query->have_posts()): $query->the_post();
?>
<div class="review">
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
</div>
<?php
endwhile;
else:
echo 'No posts';
endif;
?>
If you don’t want to hard code the blog roll in a template file, another option would be to add the category rolls to your menu in the menu editor. That way clicking on such a menu link will take you to the blog post list (archive) of the posts that belong to that archive.
Have you ever wondered how to create a 3D-transition in which an element should fly past the camera onto the webpage? Here’s how you can do that using CSS-transforms:
See the effect in action here:
FLY IN!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body{
perspective: 300px; /* the smaller, the stronger sense of perspective (like short focal lenght) */
min-height: 95vh;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr;
text-align: center;
}
h1{
grid-column: 2/3; /* Just for putting the h1 to center of grid */
grid-row: 2/3; /* Just for putting the h1 to center of grid */
transform: translate3d(800px, 200px, 1500px); /* Set the start position for the element */
animation: myflyin 2s; /* Activate the animation called myflyin */
animation-fill-mode: forwards; /* Keep the position from the last keyfframe */
}
@keyframes myflyin { /* Define the keyframes */
from {
transform: translate3d(800px, 200px, 1500px); /* Starting position */
}
to {
transform: translate3d(0, 0, 0); /* End position */
}
}
</style>
</head>
<body>
<h1>FLY IN!</h1>
</body>
</html>
Have you ever needed to force refresh a website with the Brave browser on a mobile device like iPhone or Android phone?
The need to do that may arise, for example, when developing websites for WordPress, because WordPress will attempt to cache the CSS files and your latest changes might not be reflected even if you reload the page.
Many websites advice you to go to the browser cache settings and clear the entire cache. But that is an overkill -there is a better and simpler way:
The easiest way to force Brave to force refresh on your mobile device is to switch the browser to desktop mode from the menu with the three dots. The feature is called “Request desktop site”. After switching to that, you can then switch back to a regular mobile page and the cache should be updated.
If you are getting a “Could not read source map for file” error in the console when trying to link to a JavaScript library like Tensorflow, the solution is simple. You propably don’t need the source map anyways unless you are planning to really digging into the code base of the library. So simply:
Open the script file in your code editor
Scroll all the way down
Remove the source map link at the bottom of the file
Here is an open source web tool for making branching dialogue trees for games. The alpha version is aimed specifically at Construct 3 but there are also plans for more generic JSON exporters.
If you have trouble remembering how Construct 3 calculates rotation angles, here is a quick chart for you. Note that movingAngles (which I believe are directional vectors) use a different coordinate system in which values can be also negative.
If you want to to make the movingAngle of the moveTo behavior change the animation of a character to left or right, one option is to do this:
System: (bird.MoveTo.MovingAngle+360)%360 within 88 degrees of 180 -> bird: Set animation to “flyLeft” (play from current frame)
Else ->bird: Set animation to “flyRight” (play from current frame)
The (angle+360)%360 expression converts the values to a range of 0-360 and then we can simply check if we are within a certain degree of 180 which points left and if that’s true we set the animation to the left one.
Sometimes you have a file with tens or hundreds of lines of text and you need to wrap each line with double quotes and a comma so that it can be easily put inside a javascript array. This can happen for example if your data is rows in a spreadsheet. Here’s how you can go from a list of lines to a quoted, comma separated list:
If you have been doing web development using port 10080 you might have run into some issues recently since many browsers including Chrome and Firefox have decided to add that port to their blocked ports list.
I use a tool called InstantWP for WordPress development and it’s using port 10080 for http by default.
I first researched the option to change the ports IWP is using. It seems like it could be done from the config file which you can open from the “Advanced” tab by clicking “Edit Config File”. In the file that opens you should see a setting called PortOffset. I tried to change that but couldn’t get it to work even after trying many different numbers for the port offset.
I also tried to add a flag into Chrome’s startup parameters by right-clicking the Chrome icon and choosing properties. Then I replaced the value under “target” with the following string:
However that didn’t seem to fix the situation in my case. I still got the same “unsafe port” error from Chrome.
What finally helped was switching to Firefox and performing these steps:
Type about:config to the address bar and click on the “accept the risk and continue” button.
Then paste in this string to the search bar:
network.security.ports.banned.override
Choose “string” as the type (I know, number would seem more logical), click on the + button and enter the port number you want to allow (in my case 10080).
Now you should be able to access applications via that port!
Sometimes you need to update values incrementally in your WordPress database. You might for example have an upvote feature to which you automatically add points in an incremental fashion.
It was surprisingly hard to find examples of how to do this using Wpdb. But here’s an example of doing just that:
/* Have to use wpdb->query instead of wpdb->update because the latter assumes strings */
$results = $wpdb->query($wpdb->prepare("UPDATE foodsenglish SET popularity = popularity + 1 WHERE dbID = %d", $foodIdToSendThePointFor), ARRAY_A);
