Default Elementor kit

LICENSE.md

@@ -0,0 +1,17 @@
+GNU General Public License 2.0+
+
+Copyright (c) 2016 Tonya Mork, http://hellofromtonya.com
+
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License
+as published by the Free Software Foundation; either version 2
+of the License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program; if not, write to the Free Software
+Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.

README.md

@@ -0,0 +1,185 @@
+# HELLO ELEMENTOR CHILD
+
+Contributors: [Elron Naranja](https://elronnaranja.com), Jermaine Lorenzo | This theme is produced for [Creative Bananas'](https://creativebananas.com) Projects.
+
+# Plugins
+
+### [Linkify](https://www.jqueryscript.net/text/jQuery-Plugin-To-Transform-URLs-In-Text-Into-Links-linkify.html)
+**Add this code below jQuery Enqueue**
+```
+wp_enqueue_script('cb-linkify-js', get_stylesheet_directory_uri() .'/js/linkify.min.js', array(), $ver, true);
+wp_enqueue_script('cb-linkify-jquery', get_stylesheet_directory_uri() .'/js/jquery.linkify.min.js', array(), $ver, true);
+```
+
+**Add this code in script.js**
+``` 
+$("selector").linkify();
+```
+
+### [Slick](https://kenwheeler.github.io/slick/)
+**Add this code below jQuery Enqueue**
+```
+wp_enqueue_script('cb-slick-js', get_stylesheet_directory_uri() .'/js/slick.min.js', array(), $ver, true);
+```
+**Copy the code in slick.css to style.css**
+
+# jQuery Hacks 
+
+### [MEGA MENU]
+**How to set up**
+1. Create a WP Menu.
+2. Add a <code>class</code> "mega-menu prevented" to specific menu item as trigger. 
+3. Create an elementor section as your mega menu with <code>class</code> and <code>ID</code>.
+	- <code>class</code> = mega-menu
+	- <code>ID</code> = Use the label used in the WP menu trigger. E.g "Main Services" = "main-services".
+
+Notes: It might appear to be buggy when you don't have anything on page except the header & menu. It doesn't hide the menu but only "z-index: -1" which make it still hoverable if there are no other sections on the page to cover it.
+
+**Script**
+```
+// Mega Menu
+$("li.mega-menu").each(function(){
+	// Variable the menu label as selector
+	var menuClass = $(this).find("a")[0].childNodes[0].nodeValue.trim();
+	menuClass = menuClass.replace(/\s+/g, '-').toLowerCase();
+
+	$(this).hover(function() {
+		// Add active to menu trigger to preserved hovered state
+		$(this).find("a").addClass("active");
+		$("#"+menuClass).addClass("active");
+	}, function() {
+		$(this).find("a").removeClass("active");
+		$("#"+menuClass).removeClass("active");
+	});
+	// Preserve the hover on mega menu container
+	$("#"+menuClass).hover(function() {
+		$(this).addClass("active");
+		$("li.mega-menu a:contains("+menuClass+")").addClass("active");
+	}, function() {
+		$(this).removeClass("active");
+		$("li.mega-menu a:contains("+menuClass+")").removeClass("active");
+	});
+	//// Prevent going to URL on first click on Touch Devices
+	$(this).on("touch", function(e) {
+		if($(this).hasClass("prevented")) {
+			event.preventDefault();
+			$(this).removeClass("prevented");
+		} else {
+			$(this).addClass("prevented");
+			$(this).unbind("click");
+		}
+	});
+});
+```
+**Style**
+```
+section.mega-menu {
+	position: absolute;
+	top: 0;
+	width: 100%;
+	display: block;
+	opacity: 0;
+	transition: .3s !important;
+	z-index: -1;
+}
+section.mega-menu.active {
+	opacity: 1;
+	z-index: 10;
+}
+#menu-main li.mega-menu a:hover:before {
+	content: '';
+	height: 20px; //Height of the distance from <a> to mega-menu
+	width: 300vw;
+	left: -100vw;
+	position: absolute;
+	top: 100%;
+}
+```
+
+### [READ MORE/READ LESS]
+
+**HTML Structure**
+```
+<div>
+	This is the active/visible content. 
+	<div class="read-more"> 
+		<span>This is the hidden content that'll show when the Read More is triggered.</span>
+		<a class="read-more-button" href="#!">READ MORE</a>
+	</div>
+</div>
+```
+
+**Script**
+```
+$(".read-more").each(function(){
+	// This hides the span
+	$(this).find("span").hide();
+	$(this).find(".read-more-button").click(function(){
+		// Handles the toggle HIDE/SHOW
+		$(this).prev("span").slideToggle();
+
+		// Changes READ MORE to READ LESS
+		if ($(this).text() == "READ MORE") {
+			$(this).text("READ LESS")
+		} else {
+			$(this).text("READ MORE")
+		}
+	});
+});
+```
+
+**Style**
+```
+.read-more {
+	display: inline;
+}
+```
+
+### [SPLIT/WRAP TEXT]
+```
+// Initial HTML <div>This is a text & span</div>
+// Result <div>This is a text & <span>span</span></div>
+$('div').html(function(i, v){
+	// Ampersand(&) is the trigger. The wrap will show after the ampersand(&)
+	var html = v.split('&');
+	return html[0] + ': ' + '<span>' + html[1] + '</span>';
+});
+```
+
+# Elementor Manipulations
+
+### [ACCORDION ON HOVER]
+
+**Instructions**
+1. Create an accordion in Elementor.
+2. Add "active-hover" <code>class</code>  in the accordion.
+
+**Script**
+```
+// Elementor Accordion
+$(".active-hover .elementor-accordion-item").on("mouseenter click", function() {
+	$(this).find(".elementor-tab-title").addClass("elementor-active");
+	$(this).find(".elementor-tab-content").addClass("elementor-active");
+	$(this).find(".elementor-tab-content").stop().slideDown("slow");
+	// Slide off on others
+	$(this).siblings().find(".elementor-tab-title").removeClass("elementor-active");
+	$(this).siblings().find(".elementor-tab-content").removeClass("elementor-active");
+	$(this).siblings().find(".elementor-tab-content").stop().slideUp("slow");
+});
+```
+
+This code will reset the first child as active state.
+```
+// Reset to first child active
+$(".active-hover .elementor-accordion").on("mouseleave", function() {
+	$(this).find(".elementor-accordion-item:first-child .elementor-tab-title").addClass("elementor-active");
+	$(this).find(".elementor-accordion-item:first-child .elementor-tab-content").addClass("elementor-active");
+	$(this).find(".elementor-accordion-item:first-child .elementor-tab-content").stop().slideDown("slow");
+	// Slide off on others
+	$(this).find(".elementor-accordion-item:first-child").siblings().find(".elementor-tab-title").removeClass("elementor-active");
+	$(this).find(".elementor-accordion-item:first-child").siblings().find(".elementor-tab-content").removeClass("elementor-active");
+	$(this).find(".elementor-accordion-item:first-child").siblings().find(".elementor-tab-content").stop().slideUp("slow");
+});
+```
+
+# Functions

elementor-kit/content/page/28.json

@@ -0,0 +1,131 @@
+{
+  "content": [
+    {
+      "id": "94c6c5b",
+      "settings": {
+        "flex_direction": "column",
+        "flex_gap": {
+          "column": "",
+          "row": "",
+          "isLinked": true,
+          "unit": "px",
+          "size": null
+        }
+      },
+      "elements": [
+        {
+          "id": "74d9b259",
+          "settings": {
+            "editor": "<p>Page title / H1</p><h1>Lorem ipsum dolor sit amet.</h1>"
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "60b69e34",
+          "settings": {
+            "editor": "<p>Page Headlines/ H2</p><h2>Lorem ipsum dolor sit amet.</h2>"
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "1a132103",
+          "settings": {
+            "editor": "<p>Module Headlines/ H3</p><h3>Lorem ipsum dolor sit amet.</h3>"
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "17bde2ef",
+          "settings": {
+            "editor": "<p>H4</p><h4>Lorem ipsum dolor sit amet.</h4>"
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "51f8a2e2",
+          "settings": {
+            "editor": "<p>H5</p><h5>Lorem ipsum dolor sit amet.</h5>"
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "289216ba",
+          "settings": {
+            "editor": "<p>H6</p><h6>Lorem ipsum dolor sit amet.</h6>"
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "3f7712e7",
+          "settings": {
+            "editor": "<p>Lead In Text</p>",
+            "__globals__": {
+              "typography_typography": "globals/typography?id=f261652"
+            }
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "50222592",
+          "settings": {
+            "editor": "<p>Paragraph Text</p>",
+            "__globals__": {
+              "typography_typography": "globals/typography?id=3ab9a6b"
+            }
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "text-editor",
+          "elType": "widget"
+        },
+        {
+          "id": "7ab7ba2c",
+          "settings": {
+            "text": "Button Text",
+            "typography_typography": "custom",
+            "typography_font_size_mobile": {
+              "unit": "px",
+              "size": 16,
+              "sizes": []
+            },
+            "typography_line_height_mobile": {
+              "unit": "em",
+              "size": 1.2,
+              "sizes": []
+            },
+            "__globals__": { "typography_typography": "" }
+          },
+          "elements": [],
+          "isInner": false,
+          "widgetType": "button",
+          "elType": "widget"
+        }
+      ],
+      "isInner": false,
+      "elType": "container"
+    }
+  ],
+  "settings": { "template": "elementor_header_footer", "hide_title": "yes" },
+  "metadata": []
+}