Cropping an image in the WordPress Media dialog

isme — Tue, 06 Nov 2018 17:04:07 +0000

Some themes and plugins used by WordPress require specific sizes to work properly.
The act of cutting an image to fit a specific spot is called cropping. It can be done using a program on your computer or it can be done using built in WordPress functions. Many people have some trouble getting WordPress to properly crop an image.
Cropping images in WordPress doesn’t have to be difficult.

This guide will attempt to show how images are cropped to a specific size in WordPress.

The steps go as follows:

1. Find the image in the Media page that you wish to crop to fit the required space. Click on it to show the Attachment Details dialog.

2. In the Attachment Details dialog find and click the Edit Image button.

3. This is the step is where you will crop your image. First drag the crop lines to the space you wish the image to be cropped to. You will see the image crop selection in the sidebar to the right. After you get it where you want it to be cropped you will click the button in the upper left. Then click the Save button below the image.

The image will be saved to a new image, so after the image is cropped you will need to change the address of the image where ever you wish the cropped version to be used.

Here’s hoping you got something valuable from this article!
TTFN!

Using Chromium Developer Tools to Customize Your Website’s CSS

isme — Sat, 29 Sep 2018 17:17:14 +0000

Chromium? Yes I’m referring to the Chrome browser. But are you aware that the Chrome browser is a fork of the open source Chromium browser? G-Chrome just has some proprietary software from Google added in.
For most purposes I always use the words Chrome and Chromium interchangeably.

When editing a website you can proceed in various ways.
There are expensive tools to edit your site that you can purchase or you can just use Chromium and a text editor.

Generally, you will want to model your changes then commit them.
To start, right click (Ctrl+click on Mac) the context menu contains a link that should say “Inspect Element” or “Inspect”.
That gives you access to the developer tools. In some systems you can also access this by pressing f12.

Make sure to select the element that you are wanting info on in the left panel.

You can make changes to nodes in the left by selecting one and pressing the F2 key.
Changes can also be made here by editing the styles tabs or using the console to enter and test JavaScript.

The changes don’t take effect on refresh though .. unless you copy them into the editor of your website, but that’s a subject for another post.

Good Luck!

Helpdesk – IronEggShell

Cropping an image in the WordPress Media dialog

Using Chromium Developer Tools to Customize Your Website’s CSS