Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Image Mastery within WordPress: Upload, Edit, Display, and Share with Ease

Image Mastery within WordPress: Upload, Edit, Display, and Share with Ease

With so many options in WordPress to edit and display your images, it can get confusing – “How can I rotate my image?” “How can I display my images in rows and columns?” Learn how to use the built-in tools and other plugins to upload, edit, and quickly display your images. You will also learn how to ensure those images look good when shared on social media.

Presented at WordCamp San Diego 2017 // March 25, 2017

Amber Hewitt

March 25, 2017
Tweet

More Decks by Amber Hewitt

Other Decks in Technology

Transcript

  1. How to Get Images • Shoot your own images
 (BONUS:

    you own the copyright!) • Public Domain (FREE)
 LibreStock - librestock.com • Creative Commons - creativecommons.org
 Flickr - flickr.com/creativecommons • Stock Photography
 iStock, Getty Images, Veer, Creative Market
  2. How NOT to Get Images • Google Image Search •

    Downloading from other websites • Photographing copyrighted works
  3. Before You Upload… • Reduce the pixel size!
 iPhone 6S+

    photo is 4032 x 3024 pixels • Reduce the file size!
 Average iPhone 6S+ photo size is 2 MB • Make the title of your image file relevant to the subject matter for better SEO.
 (IMG_3285.jpg should be yellow-flower.jpg)
  4. Image Apps • Photoshop/Lightroom (Mac, Windows) • GIMP (Mac, Windows)

    • Paint.NET (Windows) • Pixlr (Web-Based) • Luminar (Mac) • Pixelmator (Mac)
  5. Image Apps (Mobile) • Pixelmator (iOS) • VSCO (iOS, Android)

    • Snapseed (iOS, Android) • Enlight (iOS) • Metapho (iOS) - View & remove metadata
  6. Place the cursor where you want the image to be

    in the post/page and then click the “Add Media” button.
  7. Drag & drop your image(s) here or click the “Select

    Files” button to select the image(s) from your computer.
  8. Jetpack • GALLERY WIDGET
 The Gallery Widget provides you with

    a simple way to display a photo gallery or slideshow in your blog's sidebar. • CAROUSEL
 With Carousel active, any standard WordPress galleries you have embedded in posts or pages will launch a gorgeous full-screen photo browsing experience with comments and EXIF metadata.
  9. Jetpack • PHOTON
 Photon is an image acceleration and editing

    service for sites hosted on WordPress.com or on Jetpack-connected WordPress sites. • TILED GALLERIES
 Tiled Galleries allow you to display your image galleries in three new styles: a rectangular mosaic, a square mosaic, and a circular grid.
  10. Other Image Plugins • IMSANITY
 Automatically resizes huge image uploads.

    • FEATURED IMAGE ADMIN THUMB
 Adds inline thumbnail image to admin columns. • REGENERATE THUMBNAILS
 Allows you to regenerate your thumbnails after changing the thumbnail sizes.
  11. Image Hover Plugins • MONARCH BY ELEGANT THEMES
 Social media

    sharing (includes image hover). • WWM SOCIAL SHARE ON IMAGE HOVER
 Easily add social sharing icons on every WordPress image hover. • JQUERY PIN IT BUTTON FOR IMAGES 
 Highlights images on hover and adds a Pinterest “Pin It” button over them for easy pinning.
  12. Facebook & Twitter Plugins • YOAST SEO
 Includes options for

    specific images for Facebook and Twitter. • WP FACEBOOK OPEN GRAPH PROTOCOL
 Adds proper Facebook Open Graph Meta tags. • OPEN GRAPH PROTOCOL FRAMEWORK 
 Adds proper Facebook Open Graph Meta tags.
  13. Facebook & Twitter Plugins • FACEBOOK OPEN GRAPH, GOOGLE+ AND

    TWITTER CARD TAGS
 Inserts Facebook Open Graph, Google+/ Schema.org, Twitter and SEO Meta Tags. • JM TWITTER CARDS
 Easy integration of Twitter cards in WordPress.