Support small screen devices?

Not out of the box.
But changing the CSS to make it responsive is not hard ??

I used the twentytwelve template provided with the plugins and changed
wp-content/plugins/total-slider/templates/twentytwelve/style.css this way :

(“#featured” is a div created by the “responsive” theme)

(on small devices (phones) only the title is kept, the description text is hidden, otherwise the text recovers the image)

/*
Template Name: Twenty Twelve
Template URI: https://www.totalslider.com/
Description: Template designed for integration with the WordPress Twenty Twelve theme.
Author: Chris Van Patten (inspired by work done by the WordPress team)
Author URI: https://www.totalslider.com/
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

#featured p {display:none !important; padding:0 !important}
#featured {padding:0 !important}

#featured p.ts-twentytwelve-description {display:block !important;}

.ts-twentytwelve {
	width: 100%;
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
	height: 325px;
	position: relative;
}

.ts-twentytwelve-slide {
	background-size: cover;
	background-color: #ECECEC;
	background-position: center;
	list-style: none;
	margin: 0 !important;
	width: 100%;
	height: 325px;
	position: absolute;
	/*border-radius: 4px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); */
}

.ts-twentytwelve-link {
	display: block;
	max-width: 600px;
	width: 80%;
	min-width: 200px;
	/*border: 10px solid transparent;*/
	color: #444 !important;
	font-size: 14px;
	text-decoration: none;
	position: absolute;
	left:0  !important;
	bottom:0 !important;}

.ts-twentytwelve-link:hover {
	text-decoration: none;
}

.ts-twentytwelve-overlay {
	background: rgba(80, 80, 80, 0.8);
	padding: 20px;
	position: absolute;
	left:0  !important;
	bottom:0 !important;
	/*border-radius: 3px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	*/
}

.ts-twentytwelve-title {
	margin: 0 0 24px !important;
	line-height: 1.2 !important;
	font-size: 22px;
	font-weight: normal;
	color: #fff !important;
}

.ts-twentytwelve-description {
	line-height: 1.714285714;
	margin: 0 !important;
	color: #fff !important;
	text-align:left !important;
}

@media screen and (max-width: 640px) {
	#featured p.ts-twentytwelve-description {display:none !important; margin:0 !important;}
	.ts-twentytwelve-title {margin:0 !important}
}

Your mileage may vary with the widths/heights, but basically this does integrate total-slider pretty well with the ‘responsive’ theme using its child theme ‘responsive-full-content’. The text position in my case is set up to lower right for all slides (I negate the drag and drop feature of the text in the class : .ts-twentytwelve-overlay by setting the left and bottom to 0 with an “!important” modifier), but it’s pure laziness on my part, I did not want to write JS to reflect the modifications ?? )

ericb2038: Thanks for sharing your code!

Just to clarify on a few points, make sure you’re making your changes in a custom template file, not in the plugin itself. Every time the plugin updates, WordPress automatically overwrites all the files inside the plugin’s directory, and your changes would be overwritten, which would not be good!

Luckily, you can really easily set up a custom theme using the documentation found here.

In a nutshell, copy the Total Slider template you want to use to your-wp-theme-folder/total-slider-templates/your-total-slider-template-name/, rename the appropriate files to match your-total-slider-template-name (if you’re using that name, you would use your-total-slider-template-name.php, your-total-slider-template-name.js, etc.) then edit the style.css file to use your own information.

You can also disable the drag and drop text feature in the PHP file of your custom theme. Just change Disable-XY-Positioning-In-Admin: No to read Disable-XY-Positioning-In-Admin: Yes.

Easy!