add_action('media_buttons','add_sc_select',11);
function add_sc_select(){
echo ' <select id="sc_select"><option>TSG Read More</option><option value="[read_more_start]">Read More Start</option><option value="[read_more_end]">Read More Close</option></select>';
}
add_action('admin_head', 'button_js');
function button_js() {
echo '<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#sc_select").change(function() {
send_to_editor(jQuery("#sc_select :selected").val());
return false;
});
});
</script>';
}
function custom_read_more_start( $attr) {
ob_start();?>
<div class="ts-read-more">
<a href="javascript:void(0)" class="read-more-toogle">Read More</a>
<div class="read-more-div">
<?php return ob_get_clean();
}
add_shortcode( 'read_more_start', 'custom_read_more_start' );
function custom_read_more_end( $attr) {
ob_start();?>
</div>
<a href="javascript:void(0)" class="read-more-toogle read-less">Read Less</a>
</div>
<?php return ob_get_clean();
}
add_shortcode( 'read_more_end', 'custom_read_more_end' );
function read_more_fe_function() {?>
<script>
jQuery(document).on('click', '.read-more-toogle', function(e) {
jQuery('.ts-read-more').toggleClass('show');
//setTimeout(function() {jQuery('.ts-read-more.show .read-more-div').css('max-height', jQuery('.ts-read-more.show .read-more-div').innerHeight()+'px');}, 100);
});
</script>
<style>
.read-more-div {
max-height: 0;
transition: max-height 0.15s ease-out;
overflow: hidden;
}
.ts-read-more.show .read-more-div {
overflow: visible;
max-height: 1500px;
}
a.read-more-toogle {
display: inline-block;
background: #f5a528;
color: #fff;
font-weight: 600;
font-size: 14px;
padding: 10px 30px;
line-height: 14px;
border-radius: 8px;
margin-bottom: 10px;
text-transform: unset;
width: 100%;
max-width: 185px;
border-color: #f5a528;
box-shadow: none;
text-align: center;
}
a.read-more-toogle.read-less {
display: none;
}
.ts-read-more.show a.read-more-toogle {
display: none;
}
.ts-read-more.show a.read-more-toogle.read-less {
display: inline-block;
}
.ts-read-more {
margin-top: 25px;
}
</style>
<?php }
add_action( 'wp_footer', 'read_more_fe_function' );
Jagdish Sarma Edited question February 22, 2022