Creating Load More button for WordPress is really simple. As an option I will show you how to load more posts on scroll.
Text alignment right
Metrics help understand the behavior of your visitors.
Metrics help understand behavior of your visitorsThey measure how often an action is taken, a behavior occurred. For example, how many people use your app in a month, on average. Or, how many website visitors you had in a week. Metrics can also track desired actions, like newsletter subscriptions, and give you a subscription growth ratio month over month.
? ? ? ? ?️ ⚠️ ? ? ? ? ? ? ❤️ ? ? ⚡️ ? ? ? ⚙️ ? ☝️ ? ✅ ❌ ? ? ? ? ? ? ? ??♂️ ⭐️ …
This is heading 1 #
This is heading 2 #
This is heading 3 #
This is heading 4 #
This is heading 5 #
This is heading 6 #
Some text here…
You can use the mark tag to highlight text.
Additionally, you can use the code tag to show a piece of code.
This line of text is meant to be treated as deleted text.
This line of text is meant to be treated as no longer accurate.
This line of text is meant to be treated as an addition to the document.
This line of text will render as underlined
This line of text is meant to be treated as fine print.
This line rendered as bold text.
This line rendered as italicized text.
attr
HTML
svg #
blockquote #
#1 #
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
#2 #
Your time is limited, so don’t waste it living someone else’s life. Don’t be trapped by dogma – which is living with the results of other people’s thinking.
#3 #
A Tag Manager account represents the topmost level of organization. Typically, only one account is needed per company. A Tag Manager account contains one or more containers.
Google Doc
#4 #
With predictive audiences in Google Analytics 4, we were able to reach incremental high-performance consumers and increased our sales by 56% with 35% lower costs per order.
Notes #
Note:
warning:
Important:
Important:
Lists #
Default #
- text
- text
- text
- text
- text
- text
No bullet #
- List item
- Lorem ipsum sit amet consectetur, adipisicing elit. Officia obcaecati facilis perspiciatis commodi vitae, accusamus quidem eligendi nam nesciunt esse.
- List item
- Sub List item
- Sub List item
- Sub Sub List item
- Sub Sub List item
- Sub List item
- List item
- List item
List ul #
- List item
- Lorem ipsum sit amet consectetur, adipisicing elit. Officia obcaecati facilis perspiciatis commodi vitae, accusamus quidem eligendi nam nesciunt esse.
- List item
- Sub List item
- Sub List item
- Sub Sub List item
- Sub Sub List item
- Sub List item
- List item
- List item
List ol #
- List item
- Lorem ipsum sit amet consectetur, adipisicing elit. Officia obcaecati facilis perspiciatis commodi vitae, accusamus quidem eligendi nam nesciunt esse.
- List item
- Sub List item
- Sub List item
- Sub Sub List item
- Sub Sub List item
- Sub List item
- List item
- List item
List bordered #
- List item
- Lorem ipsum sit amet consectetur, adipisicing elit. Officia obcaecati facilis perspiciatis commodi vitae, accusamus quidem eligendi nam nesciunt esse.
- List item
- Sub List item
- Sub List item
- Sub Sub List item
- Sub Sub List item
- Sub List item
- List item
- List item
List icons #
List colored #
Lists v2 #
ol number #
CSS Framework #
Lorem ipsum dolor sit amet consectetur adipisicing elit. Optio voluptatum rerum repudiandae nobis quae, autem minima eius doloribus recusandae minus?
Components #
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita eum tempora maxime, praesentium veritatis consectetur quia laudantium pariatur.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente unde explicabo natus consequuntur laborum dolores, asperiores sint, eveniet deserunt porro illum aut ab earum non ducimus, cumque nam qui minima itaque ipsam ad esse. Atque architecto molestiae assumenda inventore dignissimos.
Global Editors #
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deserunt natus totam deleniti corporis cupiditate non aperiam adipisci quasi repellendus possimus.
ol dot #
CSS Framework #
Lorem ipsum dolor sit amet consectetur adipisicing elit. Optio voluptatum rerum repudiandae nobis quae, autem minima eius doloribus recusandae minus?
Components #
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita eum tempora maxime, praesentium veritatis consectetur quia laudantium pariatur.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente unde explicabo natus consequuntur laborum dolores, asperiores sint, eveniet deserunt porro illum aut ab earum non ducimus, cumque nam qui minima itaque ipsam ad esse. Atque architecto molestiae assumenda inventore dignissimos.
Global Editors #
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deserunt natus totam deleniti corporis cupiditate non aperiam adipisci quasi repellendus possimus.
ol icons #
List Pro Cons #
List Steps #
Starter Kit #
Download CodyFrame, our front-end framework, then run npm install and npm run gulp watch to launch your project (Show me how).
- Download CodyFrame
Or import it via CDN for rapid prototyping:
<link rel="stylesheet" href="https://unpkg.com/codyhouse-framework/main/assets/css/style.min.css">Components #
Browse our library of accessible HTML, CSS, (vanilla) JS components. Find the ones you need and copy/paste them into your project.
Global Editors #
Create your bespoke style (e.g., custom buttons and forms) using our web design tools.
separator #
Banner #
Buttons #
message box 🙅🏻♂️ #
⚠️ Note: if you receive error messages while trying to run the npm install command, you may need to install Git on your device first. You can download Git on the Git website.
? update: This bug has been fixed in iOS12.1.
Table #
BEFORE CONVERSION MODELING |
AFTER CONVERSION MODELING |
|---|---|
| ✔ | ✖ |
| Class | Description |
|---|---|
.sr-only
|
hide content to all users, except those visiting your website using a screen reader |
.js-tab-focus
|
make focus ring visible only for keyboard navigation (i.e., tab key) |
| Name | Purpose | Expires |
|---|---|---|
| _ga | This helps us count how many people visit our website by tracking if you’ve visited before | 2 years |
| _gid | This helps us count how many people visit our website by tracking if you’ve visited before | 24 hours |
| _gat | Used to manage the rate at which page view requests are made | 10 minutes |
images #
image full screen #
image right&left #
Image caption #
Perspiciatis dolorem a commodi alias, ad corporis iusto magnam in quae deleniti incidunt facilis voluptatibus. Aliquid reprehenderit, provident, totam necessitatibus cumque vel veniam consequuntur maxime iure accusamus explicabo recusandae neque quas?
Perspiciatis dolorem a commodi alias, ad corporis iusto magnam in quae deleniti incidunt facilis voluptatibus. Aliquid reprehenderit, provident, totam necessitatibus cumque vel veniam consequuntur maxime iure accusamus explicabo recusandae neque quas?
flash Message #
youtube video responsive #
twitter responsive #
Tweet this! #
Tweet this!
Campaign tracking allows to connect the dots between the initial marketing effort and what happened to the visitor after they landed on your website.
Tooltip #
Tooltip#
text to copy
Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere, whose upper half was strewn with silver. Looking down into the dark gulf below, I could see a ruddy light streaming through a rift in the clouds.
Href modal #
A video is being shown
Code #
#1.1 #
.text-to-crop {
@include lhCrop(1.2, 0.75); //using Roboto font family
}#2.1 #
function ProjectMask( element ) {
this.element = element;
this.projectTrigger = this.element.find('.project-trigger');
this.projectClose = this.element.find('.project-close');
this.projectTitle = this.element.find('h1');
this.projectMask = this.element.find('.mask');
//...
this.initProject();
}
var revealingProjects = $('.cd-project-mask');
var objProjectMasks = [];
if( revealingProjects.length > 0 ) {
revealingProjects.each(function(){
//create ProjectMask objects
objProjectMasks.push(new ProjectMask($(this)));
});
}#3.1 #
codyhouse-framework/
└── main/
├── assets/
│ ├── css/
│ │ ├── globals/
│ │ │ ├── _alignment.scss
│ │ │ ├── _breakpoints.scss
│ │ │ ├── _buttons.scss
│ │ │ ├── _colors.scss
│ │ │ ├── _forms.scss
│ │ │ ├── _grid-layout.scss
│ │ │ ├── _icons.scss
│ │ │ ├── _mixins.scss
│ │ │ ├── _reset.scss
│ │ │ ├── _shared-styles.scss
│ │ │ ├── _spacing.scss
│ │ │ ├── _typography.scss
│ │ │ └── _z-index.scss
│ │ ├── _globals.scss
│ │ ├── style.css
│ │ └── style.scss
│ └── js/
│ └── util.js
└── index.html