add_filter( 'generate_smooth_scroll_elements', function( $elements ) {
$elements[] = 'a[href*="#"]';
return $elements;
} );
Height 100vh for iOS
CSS
.my-element {
height: 100vh; /* Fallback for browsers that do not support Custom Properties */
height: calc(var(--vh, 1vh) * 100);
}
JS
// First we get the viewport height and we multiple it by 1% to get a value for a vh unit
let vh = window.innerHeight * 0.01;
// Then we set the value in the --vh custom property to the root of the document
document.documentElement.style.setProperty('--vh', `${vh}px`);
JS Eventlistener for rezising
// We listen to the resize event
window.addEventListener('resize', () => {
// We execute the same script as before
let vh = window.innerHeight * 0.01;
document.documentElement.style.setProperty('--vh', `${vh}px`);
});
GeneratePress Elements in Admin Sidebar
add_action( 'admin_menu', 'mw_gp_elements' );
function mw_gp_elements() {
add_menu_page( 'mw_gp_elements', 'GP Elements', 'read', '/edit.php?post_type=gp_elements', '', 'dashicons-text', 28 );
}
WordPress – Adding Link to Admin Sidebar
add_action( 'admin_menu', 'linked_url' );
function linked_url() {
add_menu_page( 'linked_url', 'External link', 'read', 'my_slug', '', 'dashicons-text', 1 );
}
add_action( 'admin_menu' , 'linkedurl_function' );
function linkedurl_function() {
global $menu;
$menu[1][2] = "http://www.example.com";
}
CSS change List Bullet
ul.mw-list-skew-bullets {
list-style: none;
margin-left: 1em;
line-height: 2em;
}
ul.mw-list-skew-bullets li::before {
content: "";
color: #034c93;
font-weight: bold;
display: inline-block;
width: .8em;
height: .8em;
background: #034c93;
margin-left: -1em;
margin-right: 10px;
transform: skew(-15deg);
}
ul.mw-list-strich, ul.mw-list-strich li>ul {
list-style: none;
margin-left: 1em;
}
ul.mw-list-strich li::before {
content: "-";
font-weight: bold;
display: inline-block;
width: .8em;
margin-left: -1em;
}
ul.mw-list-strich li>ul li:before {
content: "-";
font-weight: bold;
display: inline-block;
width: .8em;
margin-left: -1em;
}
Start Animation in viewport
jQuery(document).ready(function( $ ){
var $animation_elements = $('.animation-element');
var $window = $(window);
function check_if_in_view() {
var window_height = $window.height();
var window_top_position = $window.scrollTop();
var window_bottom_position = (window_top_position + window_height);
$.each($animation_elements, function() {
var $element = $(this);
var element_height = $element.outerHeight();
var element_top_position = $element.offset().top;
var element_bottom_position = (element_top_position + element_height);
//check to see if this current container is within viewport
if ((element_bottom_position >= window_top_position) &&
(element_top_position <= window_bottom_position)) {
$element.addClass('in-view');
}
/* Animation starts everytime you scroll into the view again
else {
$element.removeClass('in-view');
}*/
});
}
$window.on('scroll resize', check_if_in_view);
$window.trigger('scroll');
});
GeneratePress Elements Header
Custom Fields
{{custom_field._thumbnail_id}}
PHP code for GP Hooks
Thumbnail / Featured Image
<?php echo get_the_post_thumbnail_url( null, 'full' ); ?>
Post / Page Title
<?php echo get_the_title(); ?>
Category List
<?php echo get_the_category_list(); ?>
The content
<?php echo get_the_content(); ?>
Custom post field
<?php
$custom_field = get_post_meta(get_the_ID() , 'custom_post_field', true);
echo $custom_field;
?>
CPT UI Category List
<?php echo get_the_term_list(get_the_ID(), 'your_category', '', ', ', ''); ?>
Create a Shortcode in WordPress
add_shortcode( 'your_shortcode_name', function() {
ob_start();
?>
Your code in here
<?php
return ob_get_clean();
} );
Shortcode: [your_shortcode_name]
GeneratePress Excerpt Shortcode
function db_page_hero_excerpt() {
ob_start();
global $post;
if ( has_excerpt( $post->ID ) ) {
?>
<div class="page-hero-excerpt">
<?php echo the_excerpt(); ?>
</div>
<?php
}
return ob_get_clean();
}
add_shortcode( 'page_hero_excerpt','db_page_hero_excerpt' );
Schortcode: [page_hero_excerpt]