Close Button For Content

[Ben Thomas]

Hi Again Bill…

Thanks for your tremendous support. I have found no more issues, it seems to have cleared it’self up. I have made a few css changes and I am just wanting to ask if one last thing is possible.

When a page opens, is there any sort of script/code we could use to have a close option (it fades in it would be great if by clicking close within the page it faded back out) I had a go but didn’t get to far. It would be a good features as people could then close and see the slideshow.

I won’t pester you anymore 🙂 But if this is possible please let me know.

Thanks again for all of your help, it is very appreciated.

All the best

Ben

[Bill Robbins]

Good Morning Ben,

Fantastic question there. You can do that. We’ll need to insert this snippet:

<a id="close-button">X</a>
		
		<script>
		
			jQuery( "#close-button" ).click(function() {
				jQuery( "#content" ).toggle( "slow", function() {
				});
			});
				
		
		</script>

just before this spot:

</div><!-- #content -->

in the following files:

1. index.php
2. archive.php
3. page-menu-list.php
4. page-service-list.php
5. page-staff-list.php
6. page.php
7. single-staff.php
8. single.php
9. taxonomy-menu-group.php
10. taxonomy-service-group.php

After that you’ll also need to add this CSS to the Custom CSS box in the advanced tab of the theme options page:

#close-button {
	position: absolute;
	top: 0px;
	z-index: 20;
	color: #fff;
	right: -15px;
	font-weight: 400;
	border: 2px solid #fff;
	padding: 5px 8px;
	border-radius: 50%;
}

Feel free to change the styling to fit your needs.

Hopefully that will get you where you’d like to go.

Have a great Saturday,
Bill

[Author]

Posts