WordPress Image Control

Wiki.TerraBase.info
Revision as of 18:08, 14 February 2020 by Root (talk | contribs)
Jump to navigation Jump to search

Leaving WordPress on its own for image management on a website with a lot of images is stupid.

Items to Consider

Image

  • Title
  • File Name of Actual File
    • Naming Convention: Use modern Video Resolution terminology; 1K, 2K, 4K, 8K (which refers to horizontal resolution, whereas 1080i, 720p, etc. refer to vertical resolution)
  • Permalink Current URI (from Permalink Manager) & Native Slug (Permalink name if Permalink Manger were disabled)
  • Permalink Address Page (https://WhatEverWebSite/PermalinkURI)
  • URL Page of File (https://WhatEverWebSite/FileName): ALT Attribute of Image Element / Tag is set to the URL
  • Taxonomy (Categories and Tags) of Images: Useful internal WordPress searches and some SEO indexes
  • Additional Items for Images (Caption, ALT / Alternate Text, Description)
    • Caption is used in META Tags for various items (SEO, Twitter, OG (Open Graph Protocol - https://ogp.me/), etc.) and as the default caption when the image is viewed via a Permalink URI. Oddly Wordpress or some plugin uses it as the OG "description"
    • Description is used when image is viewed via a Permalink URL, or whenever the image is used in a Page, Post, etc.
    • ALT / Alternative Text is used in the Images ALT Attribute when viewed via a Permalink URL or whenever the image is used in a Page, Post, etc.

Redirection

  • Redirect from Image Permalink URL to Fragment Location / Anchor / ID on a Page
    • And
      • If no explicit Redirect is set up, then go to the Images Parent
      • OR
      • Stay on the Image's Permalink URL

WordPress Functionality

  • Automatic "Thumbnail" (Resized Image) Generation that are automatically generated by WordPress, Themes, Plugins, etc.: Wordpress sets the SRCSET Attribute

SEO stuff

  • Canonical URLSs are only useful if an end Image / Item / etc. falls under multiple categories (IE is duplicitous) and a Search Engine needs to know which one is the default.

Other Nice Additions if Possible

  • Search Results just for Images???
  • Custom CSS for Permalink URI??? - see below (Simple CSS offers custom CSS for an Image, but it doesn't show up on Permalink URI)
  • Index and / or Table of Contents (for all of website & only images, so two indexes or table of contents)

Plugins

  • Plugins To Manage Images and Media
    • Media Library Assistant: Adds Parent Field to an image, adds some (obscure) fields to what can be associated with a Media File, Parent Info, Menu Order, Attachment Metabase (read only), and an alternate list view, Allows for additional Categories to be created
    • Enhanced Media Library (useful): Some Utilities for importing and exporting, Add several tabs to Settings, Media (including allowed file types)
    • Add from Server: A plugin that allows upload of files that otherwise cause the Wordpress Media functionality to cough up a hairball (large files, etc.)
    • Permalink Manager - Manages all Permalinks, including Media and Images, with a Bulk Updater (Make sure to enable "Native Slug" in Tools, Permalink Manager, Settings)
    • Auto Image Attributes - Changes Attributes (ALT, etc.), based on File Name. Useful if there aren't any ALT entries for an image
    • Phoenix Media Rename (useful) is a simple Plugin that allows for this and it even automatically replaces spaces with dashes ( - ). It also allows for "bulk renaming", but only for manual modifications to the name (IE, it can't add "My Web Site" to the beginning of every file name).
    • Media File Renamer: Phoenix is better
    • WP Media Folder (very useful, but...): Creates a folder and file structure for media, so very handy for a lot of media. Unfortunately it breaks some other Media Plugins, but the fix is easy, just disable it for others to work.
    • Plugin that will create a default ALT description if there isn't one???
    • Plugin that will redirect Permalink for Image to a Lightbox based on Category
      • For most websites, a combination of the below two plugins properly configured will allow Image Permalinks to redirect to another page
        • To redirect all Image Permalinks to the Homepage;
          • Attachment Pages Redirect: A simple Plugin that redirects Attachment Pages (like Media and Images) to a Parent Pages (created with Media Library Assistant) and under other circumstances, like 404 (page doesn't exist), etc.
        • To redirect Image Permalinks to a Parent Page;
          • Media Library Assistant: Provides the ability to create a Parent Element for Media and Images
        • To redirect Image Permalinks to specific Pages;
          • Redirect (under Tools, Redirection); This Plugin provides the ability to create a list of of redirects.
      • For Plugins like Timeline Express that have delayed rendering which affect Fragment Location / Anchor scrolling, additional steps have to be taken.
        • To redirect Image Permalinks to specific Pages;
          • Redirect (under Tools, Redirection); This Plugin provides the ability to create a list of of redirects.
        • ...and then insert the below code into a Footer (using Header Footer Code Manager) where the Timeline is configured;
          <script>
          
          document.addEventListener('readystatechange', event =>
          {
          	if (event.target.readyState === "interactive")
          	{
          	setTimeout(DelayedFunction, 1000)
          	}
          }
          );
          
          function DelayedFunction()
          {
          var location_hash = window.location.hash;
          var location_minus_hash = location_hash.substr(1,);
          var element = document.getElementById(location_minus_hash);    
          element.scrollIntoView();
          }
          
          </script>
      • Ideally the landing page for an image obtained from a search engine should have a page that says, "Here is the image by itself. And here is the link to the actual location on another page"
        • OR
      • Use the below "Parent Redirect" method, then a Plugin that does "After Page Load", "Smooth Scroll to position"
        • This can include Lazy Loading, Page Animation while Loading. However, Lazy Load (like a3 Lazy Load, Smush, etc.) can break functionality of specialty image plugins like Magic Zoom (because they have their own lazy load feature)
      • ...or redirect image to intended location instead of the Permalink URI
        • Redirect: Tools, Redirection; This provides a simple list of redirects. Some Plugins like Timeline Express have delayed rendering which will affect Fragment Location / Anchor scrolling
        • Attachment Pages Redirect with Media Library Assistant: https://wordpress.org/plugins/attachment-pages-redirect/: Redirects Permalink URI to a Page, etc (Permalink of Page, etc.)
        • Yoast will do this, but it kills off it's ability to create an Image Index
        • All in One SEO will do it to, but not sure about having both it and Yoast installed
        • In the image.php (Wordpress or Theme?) file: <?php wp_redirect(get_permalink($post->post_parent)) ; ?>
        • A really complex idea would be to use the Attachments Pages Redirect, Media Library Assistant (to define Parent), and some PHP code to create a URL "on the fly"
    • Plugin that creates a Title for an Image (Media Assistant???)???
    • Plugin for custom Image CSS
      • Simple CSS (Under Appearance, Pages, Posts, Images, etc.): This adds a custom CSS Field to Images (does not work with Permalink URI)
      • Simple Custom CSS is too simple (it's just a single field for the entire website)
      • Custom CSS Pro is great for previewing what it will do to a website, but appears to apply site wide to everything.
    • Plugin for Image Contents or Index Page???
    • Plugin for dedicated Image SEO (IE, not Yoast)

WordPress Issues

WordPress does not include a Title for an Image

Other Stuff to Think About

Remove EXIF information for privacy. Read more here: https://www.wpexplorer.com/wordpress-image-management/

A default redirection for any 404 (broken links) to redirect to home page.