Colours and buttons

Home admin tools Colours and buttons

Icons inside text widgets

Below are some common icons used on the site to indicate what happens when a link is clicked. To copy this code, hover over the code snippet and click copy here in the front-end, then paste this into the text/code edit window on the page where it should appear.

External link icon
				
					<i class="fas fa-external-link-alt" aria-hidden="true"></i>
				
			
Envelope icon
				
					<i class="far fa-envelope" aria-hidden="true"></i>
				
			
User/login icon
				
					<i class="far fa-user" aria-hidden="true"></i>
				
			
Word file icon
				
					<i class="far fa-file-word" aria-hidden="true"></i>
				
			
PDF file icon
				
					<i class="far fa-file-pdf" aria-hidden="true"></i>
				
			
Right arrow
				
					<i aria-hidden="true" class="fas fa-arrow-right"></i>
				
			
Right chevron
				
					<i aria-hidden="true" class="fas fa-chevron-right"></i>
				
			
Down chevron
				
					<i aria-hidden="true" class="fas fa-chevron-down"></i>
				
			

Icons inside buttons

To copy these buttons with icons, edit the page in Elementor and copy-paste each button individually into another page.

TBA

Buttons

TBA

Inline images and text

To line an image such as a logo up with the text, and have it scale nicely on all screens – copy the container which houses both the container withe image, and the container with the text