Client Guides & Resources

				
					nano /etc/apache2/sites-available/[domain.com].conf
				
			
				
					<virtualhost *:80>
    ServerName [domain.com]
    ServerAlias www.[domain.com]
    DocumentRoot /var/www/[user]/[domain.com]
    ErrorLog /var/log/apache2/[domain.com]-error.log
    CustomLog /var/log/apache2/[domain.com]-access.log combined
    <directory /var/www/[user]/[domain.com]>
        AllowOverride All
        Require all granted
    </directory>
    <ifmodule mod_rewrite.c>
        RewriteEngine On
        RewriteCond %{HTTP_HOST} ^www.[domain][.com]$ [NC]
        RewriteRule ^ http://[domain][.com]%{REQUEST_URI} [R=301,L]
    </ifmodule>
RewriteCond %{SERVER_NAME} =[domain.com] [OR]
RewriteCond %{SERVER_NAME} =www.[domain.com]
RewriteRule ^ https://%{SERVER_NAME}%{REQUEST_URI} [END,NE,R=permanent]
</virtualhost>

				
			
				
					nano /etc/apache2/sites-available/[domain.com]-ssl.conf
				
			
				
					<ifmodule mod_ssl.c>
<virtualhost *:443>
    ServerName [domain.com]
    ServerAlias www.[domain.com]
    DocumentRoot /var/www/[user]/[domain.com]
    ErrorLog /var/log/apache2/[domain.com]-error.log
    CustomLog /var/log/apache2/[domain.com]-access.log combined
    <directory /var/www/[user]/[domain.com]>
        AllowOverride All
        Require all granted
    </directory>
    <ifmodule mod_rewrite.c>
        RewriteEngine On
        RewriteCond %{HTTP_HOST} ^www.[domain][.com]$ [NC]
        RewriteRule ^ http://[domain][.com]%{REQUEST_URI} [R=301,L]
    </ifmodule>
SSLCertificateFile /etc/cloudflare/[domain.com].pem
SSLCertificateKeyFile /etc/cloudflare/[domain.com].key
</virtualhost>
</ifmodule>

				
			
				
					nano /etc/cloudflare/[domain.com].pem
				
			
				
					nano /etc/cloudflare/[domain.com].key
				
			
				
					a2ensite [domain.com]-ssl [domain.com]
				
			
				
					service apache2 reload
				
			

Dynamic Content for Elementor

Fields that are currently showing in the ACF Field lookup:

  • Email Field
  • Number Field
  • Password Field
  • Text Field
  • Text Area Field
  • WYSIWYG Field
  • oEmbed Field
  • Checkbox Field
  • Radio Field
  • Select Field
  • True / False Field
  • Color Picker Field
  • Date Picker Field
  • Date Time Picker Field
  • Google Map Field
  • Time Picker Field

Field types that are NOT showing in the ACF Field lookup:

  • Button Field
  • Hidden Field
  • Range Field
  • Slug Field
  • URL Field
  • Code Editor Field
  • File Field
  • Gallery Field
  • Image Field
  • Button Group Field
  • Advanced Link Field
  • Forms Link Field
  • Link Field
  • Page Link Field
  • Post Object Field
  • Relationship Field
  • User Field
  • Post Object Field
  • Relationship Field
  • Taxonomy Field
  • Taxonomy Terms Field
  • Google reCaptcha Field

ACF Dynamic Token

				
					[acf:field_group_field_name]
				
			

ACF Simple Text-Based Fields Shortcode

				
					[acf field="field_name" post_id="123"]
This is a story about a boy named [acf field="name"].

Elementor CSS

				
					/* Fix Elementor Post Image Padding */
.elementor-posts .elementor-post__card .elementor-post__thumbnail {
    padding-bottom: 0 !important;
}
				
			
				
					/* Elementor Sticky Header */
.elementor-sticky--effects { background-color: #000; 
}
.elementor-sticky--effects .logo img {
width: 50% !important;
}
.e-header {
    position: absolute;
    width:100% !important;
}
.elementor-sticky--effects { background-color: #19405A; 
    transition: background-color 0.5s ease !important;
}
.elementor-sticky--effects .logo img {
    width: 75% !important;
}
.logo img {
transition: width 2s ease !important;
}
				
			
				
					/* Shrinking Logo Header */
.logo-img {
    max-width: 200px;
    width: 200px;
}
.elementor-sticky--effects .logo-img {
    max-width: 100px;
    width: 100px;
    transition: 0.5s all ease-in-out;
}
/* Mobile Settings*/
@media screen and (max-width: 780px) {
.logo-img {
    max-width: 200px;
    width: 200px;
    }
.elementor-sticky--effects .logo-img {
    max-width: 150px;
    width: 150px;
    transition: 0.5s all ease-in-out;
    }
}
				
			
				
					/* Creative Border Styling */
hr {
	border-color: #B78E2C;
	border-width:3px;
	background-color: #B78E2C;
	border-top: none;
	border-left: none;
	border-right: none;
}
				
			

Modern Event Calendar (MEC) CSS

				
					/*MEC CALENDAR*/
section#main-content {
    min-height: 600px !important;
    padding-top: 50px;
}
				
			

LEarndash CSS

				
					/* LEARNDASH STYLING */
.ld-course-status-action form {
    padding-right: 10px;
}
				
			

Content CSS

hr divider styling

				
					hr {
	border-color: #B78E2C;
	border-width:3px;
	background-color: #B78E2C;
	border-top: none;
	border-left: none;
	border-right: none;
}
				
			

Bullet List Padding

				
					/* Add padding to the bottom of lists */
ul, ol {
    margin-bottom: 0.9rem;
}
				
			

Table Border Colors

				
					table td, table th {
    border: none;
}
				
			

Table alternating Row Colors

				
					table tbodytr:nth-child(odd)td {
    background-color: #ffffff !important;
}
				
			

Table row colors on hover

				
					tr:hover td {
    background-color: #ffffff !important;
}
				
			

Style WP Block Quotes

				
					/* Style WP Block Quotes */
blockquote {
    border-left: solid 2px;
		border-color: #E29E21;
    padding-left: 15px;
}
				
			

Text Alignment (Vertical and Horizontal)

				
					// Place on div containing text
.center {
  border: 2px solid red;
  display: flex;
  justify-content: center;
  height: 12em;
  align-items: center;
}
// Alternative Method
.heading-div {
  width: 80%;
  border-style: solid;
  border-width: 1px;
  border-color: #000;
  margin: auto;
  padding: 10px;
}
.heading {
  margin: auto;
  border-width: 1px;
  border-style: solid;
  border-color: red;
  text-align: center;
  height: 12em;
  line-height: 12em;
}
				
			

Cut off text with elipses

				
					selector h2{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
				
			
				
					selector p {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
				
			
				
					selector {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
				
			
				
					.three-row{
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
				
			

Hello Elementor Theme Styling

				
					/*HELLO THEME WOOCOMMERCE PADDING*/
div#primary {
    padding-top: 50px;
    padding-bottom: 50px;
}
				
			

User Registration CSS

				
					/* User Registration Default Form Styling */
.ur-form-row span.input-wrapper {
    width: 75%;
}
.ur-form-row input {
    border: solid 1px #BEBFC1;
    border-radius: 3px !important;
}
.ur-form-grid.ur-grid-1 {
    padding-bottom: 20px !important;
}
.ur-form-row input {
    margin-bottom: 0px !important;
}
div#ur-recaptcha-node {
    padding-left: 5px;
}
				
			

Mobile Responsiveness

				
					@media only screen and (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}
				
			

Disable WordPress Editor

				
					// CUSTOM CSS STYLING IN WORDPRESS ADMIN DASHBOARD — VERY IMPORTANT
/* Globally disable Back to WordPress Editor button */
/* Hide the Back to WordPress Editor button… Would break pages built with Elementor.

Known Issues

Ultimate Addons for Elementor causing infinite loading in Elementor
Disable auto-update Email Notifications causing critical errors