Soliloquy Documentation

Documentation, Reference Materials, and Tutorials for Soliloquy

How to Add Link Classes

Important: This doc assumes you’re comfortable creating and/or editing PHP files in your WordPress installation and is intended for advanced users.

REQUIRED:
Soliloquy 2.4.3.4 or higher

You can add custom CSS classes to image and video slide links following this guide.

Step 1 – Create Plugin File

The first step is to create a new php file in the wp-content/plugins/ directory of your WordPress installation. The easiest way to do this is using your favorite FTP program or through your web hosting account’s file editor (if they provide one).

Once you’ve navigated to the wp-content/plugins/ directory, create a new file with the name soliloquy-add-link-classes.php

Step 2 – Edit the New Plugin File

Next, you’ll want to copy and paste the following code into the soliloquy-add-link-classes.php plugin file you’ve created, and change my-class to the class you wish to apply to image and video slide links:

<?php
/**
* Plugin Name: Soliloquy - Add Classes to Links
* Plugin URI: https://soliloquywp.com
* Version: 1.0
* Author: Tim Carr
* Author URI: http://www.n7studios.co.uk
* Description: Add CSS classes to slide links
*/

/**
 * Add CSS classes to image slide links
 *
 * @since 1.0
 *
 * @param array $classes 	CSS Classes
 * @param int 	$id 		Slider ID
 * @param array $item 		Slide
 * @param array $data 		Slider Config
 * @param int 	$i 			Index
 * @return array 			CSS Classes
 */
function sol_soliloquy_add_image_classes( $classes, $id, $item, $data, $i ) {
	
	$classes[] = 'my-class';
	return $classes;

}

add_filter( 'soliloquy_get_image_slide_link_classes', 'sol_soliloquy_add_image_classes', 10, 5 );

/**
 * Add CSS classes to video slide links
 *
 * @since 1.0
 *
 * @param array $classes 	CSS Classes
 * @param int 	$id 		Slider ID
 * @param array $item 		Slide
 * @param array $data 		Slider Config
 * @param int 	$i 			Index
 * @return array 			CSS Classes
 */
function sol_soliloquy_add_video_classes( $classes, $id, $item, $data, $i ) {
	
	$classes[] = 'my-class';
	return $classes;

}

add_filter( 'soliloquy_get_video_slide_link_classes', 'sol_soliloquy_add_video_classes', 10, 5 );

Step 3 – Activate the New Plugin

The last step is to navigate to the WordPress Admin > Plugins screen, locate the plugin named Soliloquy – Add Classes to Links and activate the plugin.

That’s it! Your image and video slide links will now contain the custom CSS class you’ve defined in the custom plugin file!

Need help learning how to add links to slides?

[i]
[i]