Creating Your First Slider
Are you ready to get started on creating your first slider? If you’ve already installed Soliloquy, this tutorial will give you a step by step guide on creating your first Soliloquy Slider.
- Add New Slider
- Name Your Slider and Upload Images
- Editing Image Metadata (optional)
- Configure Your Slider (optional)
- Embed your Soliloquy Slider
Step 1: Add New Gallery
Your first step in creating your first Envira gallery is to click the Add New button in the Envira Gallery admin screen.
Step 2: Name Your Slider and Upload Images
This will open a blank slider screen ready for you to configure and add your images.
Start by giving your new slider a title.
We recommend you avoid using generic titles and instead try to give your sliders unique and easily identifiable titles to make it easier to manage them later on.
Next, you’ll need to insert some images into your slider. You can add images to your slider in two ways:
Select Images from Your Computer
You can upload images into your slider by selecting the Select Images from Your Computer button.
When using this option, your images are handled by and stored in the WordPress Media Library.
You can add those same images to other places in your site without having to upload them again!
Select Files from Other Sources
If you want to pick from the Media Library in WordPress, click the Select Files from Other Sources.
You’ll have 2 tabs to choose from for uploading.
If you select the Upload Files tab you can just drag and drop your images from your computer into this area and it will automatically upload them into WordPress Media Library.
Or you can select the Media Library tab and just pick the images from the Media Library to insert into your gallery.
In this example, we’ll be adding images to our gallery from the Media Library.
If you want the images you add from the Media Library to show the original image in Lightbox view, be sure the Attachment Display Settings are set to link to the Media File. You can adjust this setting if you don’t use Lightbox functionality and want to link to the Media Page, or a custom URL when the user clicks the image.
Once you’ve chosen the images you want to add to your slider from the Media Library, select the Insert Into Slider button.
Step 3: Editing Image Metadata (optional)
Editing the metadata allows you to customize the image Title, Caption, Alt Text (recommended for SEO and for visitors using screen readers) and edit the URL each image links to as well as many other settings depending on the Soliloquy addons you have installed and activated.
To edit the metadata for a photo, select the pencil icon on the top left of an image’s thumbnail:
This will open the Edit Metadata window.
Modify any of the fields you wish and select the Save Metadata button to save the changes.
You can easily use the right and left arrows in the top right-hand corner of the pop up to edit each image in your slider and repeat these steps for each image.
Step 4: Configure Your Slider (optional)
The next thing you’ll want to do is configure the options of the Soliloquy slider to fit your needs.
Each of the tabs you see for your slider configuration will depend on your license level and the installed addons.
You can choose to set up your Slider Dimensions on the Configuration tab or Enable the Lightbox on the Lightbox tab. The setup is completely up to you.
Once you have changed your settings, select the Publish or Update button to save the changes.
Step 5: Embed your Soliloquy Slider
After you’ve published your slider, you can see your available insert options in the sidebar.
Finally just create a new page, select the Add Slider button.
Choose the slider you want to add and then select the Insert button.
Publish your new page and view it on the front-end of your site to see the new slider you’ve created.
Congratulations, you have now completed your first Soliloquy slider! Feel free to go and tweak your slider as you see fit to best meet your needs. Enjoy!
Now that you’ve completed your first slider, be sure to check out our blog for new tips!
- Fix: Updater class.
- Fix: Minor bug fixes.
- Fix: PHP optimizations to improve performance.
- Fix: Minor bug fixes.
- Fix: PDF Slides not inserting.
- Fix: Admin CSS.
- Fix: Admin conflicts with nextgen.
- Fix: Mobile Captions.
- Fix: Various minor bugs.
- Fix: Importer failing with some slide IDs.
- Added: Sort order.
- Changed: Slider Options order.
- Fix: Errors not displaying properly when video fails to insert.
- Fix: Video Url not updating.
- Fix: Widget title using meta field instead of title.
- Fix: HTML Slides data not showing up.
- Fix: Video data not showing up.
- Fix: Inserting External Video PHP 5.3 compat issues.
- Fix: Cases where Meta Edit for slides in unavailable.
- Fix: Various small bugs.
- Fix: Compat with PHP 5.2 causing admin screen to be un-functional
- Fix: Conflict with Envira Gallery
- Slide status visual indicated edit screen
- Publish Status now bulk
- Vertical Thumbnail a
- List/Grid view now slider specific
- Fix youtube videos pausing all videos on page
- Fix List/Grid default option
- Fix v1 to v2 update
- Settings tabs now return to current screen after publishing/updating a slider
- Fix Code Meta Edit
- Retina Logo
- Fix: Fix: Cases where slug shortcodes don’t appear.
- Fix: Slider Controls appearing on single images
- Fix: Infinite Loop not properly loopnig on mobile
- Fix: Slide position from being set improperly
- Fix: Last slide from appearing first with in cases where infinite loop is enabled.
- Fix: Thumbnails Addon not loading properly chrome
- Added: RTL for sites that use RTL body or html class.
- Fix: Featured content from disappearing after transient expires.
- Fix: RTL Pager CSS.
- Fix: Double click play for local videos in Safari
- Added: Fullscreen video button for local videos
- Added: Option for Autoplay for Videos
- Fix: Vimeo video not pausing transition.
- Fix: Video output for displaying with Soliloquy Lightbox add-on
- Fix: Slide Transition animation from looping properly
- Added: fr_FR Translations
- Fix: Self-hosted videos use the video poster attribute to correctly display placeholder images
- Fix: When appending insert slider buttons to Visual Editors, check for $post instance rather than assuming it exists. Prevents faults with plugins using the Visual Editor but not a Post or Post Type
- Fix: Use WP_Query to get sliders when cache/transient is empty, preventing slider output blanking after a day when using caching plugins
- Added: scoped attribute to inline CSS
- Fix: Compat with Soliloquy Carousel cloned slides not displaying
- Fix: Remove box-shadow from links on sliders, which may be caused by Twenty Sixteen and other themes
- Fix: Slider slug would not save when changed
- Fix: foreach() warning when attempting to add a widget and no sliders defined
- Fix: Vertical slideshow with start on slide = 0 would result in incorrect slide being displayed
- Fix: Modal close icon for WordPress 4.4
- Added: soliloquy_get_image_slide_link_classes and soliloquy_get_video_slide_link_classes filters to allow developers to add classes to links
- Fix: Pause slider when YouTube video is buffering, not just playing.
- Fix: Prevent keyboard events stealing focus from input and text areas
- Fix: Moved soliloquy_output filter to end of shortcode() function to ensure all output can be filtered.
- Added: Image resize/crop error messages are output to logged in WordPress users where WP_DEBUG enabled.
- Added: Updated image uploader to prevent images increasing in file size and not displaying correctly when an image has an sRGB profile
- Fix: WordPress 4.3 compatibility for Widget
- Fix: WordPress 4.3 compatibility for modal close icon
- Fix: Stopped WPML Media displaying duplicate images when inserting images from other sources
- Fix: Import routine improved to fully import image and video metadata.
- Fix: Widgets: Featured Content widgets appear in dropdown when managing Widgets.
- Added: Pause on Navigation: option to enable/disable slider autoplay when navigation interaction occurs (default = Yes, which is standard Soliloquy functionality)
- Added: get_sliders() arguments to include empty (Featured Content) sliders and ignore cache for transient clearing in the Featured Content Addon
- Fix: Exclude Defaults and Dynamic Sliders when querying get_sliders()
- Added: Mousewheel support
- Added: Guidance on Setting Dimensions on Images if using Photon CDN and experiencing issues
- Added: Filter on image dimensions for Carousel Addon to correctly define width and height of images when Set Dimensions on Images = Yes
- Fix: Prepend slides before existing slides in older versions of PHP
- Fix: Force slider ID to match Post ID on Publish / Update; this resolves numerous issues where the wrong sliders may display when duplicating sliders or using WPML
- Added: ID, slider item, slider config and slider type arguments to soliloquy_crop_image_args filter, to allow developers to modify cropping/resizing arguments on a per-slide basis.
- Added: Setting to add slides before or after existing slides.
- Fix: Reordering slides without clicking Update on a slider would result in config settings being lost.
- Added: Infinite Scroll support (please refer to docs for how to implement)
- Added: Left/Right thumbnail styling support
- Fix: Support for multiple slideshows with YouTube videos on a single Page
- Added: Local video support
- Fixed: Caption CSS positioning
- Fixed: Cannot modify headers error on ajax.php
- Added: Insert from Other Images Sources - automatically load images on scroll and search
- Fixed: Featured Content sliders honour caption position setting
- Added: esc_url() on add_query_arg() calls
- Added: Caption Position (Top, Bottom, Left, Right - defaults to Bottom)
- Fix: Video Caption HTML markup producing invalid W3C validation results
- Fix: Removed deprecated This Post’s Slider on Add Slider button
- Fix: Edge case where some v1.5.x to v2.3.x+ migrations would result in sliders not displaying in the WordPress Administration.
- Added: Option to choose aria-live setting (off, polite, assertive; defaults = polite)
- Fix: JS error when attempting to set aria-control attribute when using Dynamic Addon
- Added: ARIA roles and tabindex on slideshow control and pager elements for better a11y compatibility
- Added: Ticker option
- Fix: Image dimensions not displaying when enabled on Dynamic Sliders
- Added: Filter for Addons to load in CSS files
- Fix: Mobile detection wrongly including some tablet devices.
- Added: Conditional UI elements on Admin Screens
- Added: Mobile Tab - mobile slide image option moved to this new tab
- Added: soliloquy-item-XXX class to each li element
- Fix: Thumbnails compatibility with upgraded slider JS
- Fix: IE11 Carousel Addon Compatibility
- Fix: Upgraded slider JS
- Fix: Mobile image loading
- Fix: Improved error message UI when uploading files exceeding WordPress / PHP file size limits
- Fixed: When upgrading from 18.104.22.168 or later, ensure the New Slide Status is set to Published if the user has not updated this via Soliloquy - Settings
- Added: Enable Captions on Mobile
- Fix: Insert/Edit Link modal in Attachment Editor was hidden behind Attachment Editor Modal
- Added: Caption Delay after slideshow transition
- Added: RTL Support
- Added: Filters on slider item image class element
- Added: Option to include image dimensions in output for Google Pagespeed compatibility
- Fix: YouTube and Vimeo placeholder images are attached to the relevant Soliloquy Slider on wp_insert_attachment() when viewed in the Media Library.
- Added: Youtube Video Placeholder Image - attempt to retrieve HD version, fallback to SD version
- Added: Vimeo Video Placeholder Image - uses new API to get highest resolution image available
- Added: soliloquy_media_buttons filter for Add Slider button
- Fix: YouTube Video Placeholder - prevent grey placeholder thumbnail from being retrieved on some videos
- Fix: media_buttons filter replaces depreciated media_buttons_context filter
- Added: Button in Soliloquy > Settings to fix broken site migrations where slides are missing
- Added: Global publish/draft default in Soliloquy > Settings. Used to automatically assign published/draft status to slides added to existing sliders
- Fix: Updater checks for plugin and addons w/ WordPress 4.1 support
- Fix: Support for HTMl slideshows with non-alphanumeric characters on edit
- Fix: Prevent the same stylesheets loading multiple times on a single Page/Post/CPT
- Fix: Height calculation bug when using AJAX preloading
- Added: When editing an existing slider, new slides added can have their status set to draft or published.
- Fix: Carousel bugs
- Fix: Slider reducing to 1px height bug
- Added: WordPress 4.0 Edit Metadata UI for slides.
- Added: Better Video Placeholder retrieval methods for enhanced performance.
- Added: Filter to get_image_info() to support third party filtering of cropping methods.
- Added: Localization Support
- Changed: Video thumbnail is now called Video Placeholder image to avoid confusion with the Thumbnails Addon.
- Fix: Vimeo over HTTPS JS errors
- Fix: Video controls not working when slider control nav enabled.
- Fix: Mobile touch swipe support for video slides
- Fix: SSL checks when loading Addon images in WordPress Administration
- Fix: Display reason why images cannot upload (max file size exceeded, file permission error etc).
- Fixed bug with sliders displaying in IE8.
- Fixed bug with sliders saving to the wrong post type.
- Fixed possible bug that prevented slider output in some cases.
- Bug fixes and UI Refreshs for WordPress 4.0.
- Improved performance and reliability for plugin update and license checks.
- Fixed bug with YouTube API not pausing the slider when a video starts playing.
- Fixed bug with saving sliders to regular posts instead of the Soliloquy post type.
- Fixed performance bug with API automatic updates.
- Fixed bug with video slides on mobile devices.
- Other bug fixes and improvements.
- Various bug fixes and performance improvements.
- Fixed bug with API updater sending requests on admin pageloads.
- Fixed bug with hidden post type screen errors.
- Added new filter to filter styles on individual slides.
- Fixed issue with getting slider by slug when slugs were similar.
- Improved image upload responses by standardizing with the main refreshing function.
- Fixed asset loading issue where styles would not be applied soon enough when the slider loaded.
- Added descriptive classes to the no JS fallback slider output.
- Added main support for lightbox thumbnail cropping in the main
- Fixed image indexing bug with Google.
- Fixed some bugs with the Classic theme.
- Fixed max_execution_time bug on some shared hosts for image cropping.
- Fixed bug where link dialog box would load underneath metadata modal dialog.
- Improved asset loading with minified files and reduced HTTP requests.
- Updated CodeMirror for HTML slides.
- Added contextual classes for UI elements to the slider.
- Fixed bug with HTML thumbnails not inserting when creating the HTML slide.
- Fixed bug with Soliloquy duplicating images excessively when trying to retrieve cropped images.
- Improved contextual language in metadata editing area.
- Fixed bug with Settings page tabs not appearing.
- Fixed bug with with over aggressive sanitization of dropdown settings.
- Fixed bug with Dynamic addon not cropping images correctly.
- Fixed bug with
func_get_args not grabbing all parameters when cropping images.
- Fixed bug where "Full Width" would persist from one slider to another if more than one was on a page.
- Fixed bug where sliders would start auto sliding after pausing a video even if auto was set to false.
- Improved slider height calculation to prevent content shifting.
- Fixed bug with not having proper thumbnail cropping support if cropping for the main slider was turned off.
- Improved getting video thumbnails by using the WP HTTP API.
- Don't show upgrade notice for new users of Soliloquy.
- Many various bug fixes and general improvements.
- Fixed bug with image cropping for sizes registered with WordPress.
- Fixed backwards compat bug with slider shortcodes that used IDs as values.
- Added ability to parse shortcodes in widgets to prevent sliders from disappearing.
- Fixed error in slider display.
- Slider metabox now only appears on Soliloquy post type screen by default (can filter to add to other post type screens).
- New "Full Width" size setting to allow full width sliders.
- Fixed navigation arrow regression (arrows only display on hover in Classic theme).
- Improved upgrade and settings import from v1 to v2.
- When switching back to Default slider size, the dimensions will adjust to the default slider dimensions.
- Fixed slider shrinking bug (woohoo!).
- Fixed some upgrade issues and defaults for new slider settings.
- Improved styling and backwards compat styling for captions.
- Added automatic thumbnail generation for video slides from the video source.
- Added ability to set none position styling for the slider (upgraded sliders now default to this).
- Added support for starting slide option and dynamic starting slides.
- Improved styling for iframe and object tags in HTML slides.
- Improved slider engine inline style handling for better responsive support.
- Improved backwards compat support for v1 template tags.
- UI styles and improvements.
- Fixes many UI regressions when upgrading from v1 to v2.
- Added new filter to change Soliloquy metabox priority.
- Fixed bug with slides not appearing properly for slide transitions.
- Fixed bug with HTML slides not displaying.
- Tons of bug fixes and stability improvements.
- Fixed bug with captions appearing on top of slides instead of bottom.
- Fixed bug with captions being malformed with video slides.
- Captions now parse shortcode properly (regression fix).
- Added new tab link option back to metadata options (regression fix).
- Check to ensure Upgrader is available before loading.
- Add backwards compat support for transition classes on sliders.
- Fixed admin script dependency issues.
- Fixed error with caption styling.
- Adds backwards compat and legacy support for v1 addons upgrading system to allow addons to upgrade.
- Fixed bug with dra-and-drop uploader in WordPress 3.9.
- Fixed issue where URLs would not match new site after migration.
- Add proper quotes around JS object keys to prevent JS parse errors.
- Allow captions to be placed outside of the slider.
- Miscellaneous bug fixes and improvements.
- Say hello to version 2.0!