eclarrrk

// Add non-breaking space between the last 2 words of the elements selected
var noSpace = document.querySelectorAll(":is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, *:not(.keep-space)");
for (var i = 0; i < noSpace.length; i++) {
    var headline = noSpace[i].innerHTML;
    // count the amount of spaces in the headline
    var wordCount = headline.split(" ").length;
    // if there are 3 spaces or more in the headline...
    if (wordCount > 2) {
        headline = headline.replace(/ (?=[^ ]*$)/i, "&nbsp;");
    }

eclarrrk

<?php
function register_csg_patterns() {
}
 
add_action( 'init', 'register_csg_patterns' );

function myBlockTemplate() {
	$myBlockTemplate = get_post_type_object( 'myCustomPostType' ); // Adds these blocks to a specific post type
	$myBlockTemplate->template = array(

eclarrrk

<?php
  if ( 'page' === get_post_type() ) {
      echo wp_trim_words( get_the_content(), 30, '...' ); 
  } else {
      the_excerpt();
  }
// wp_trim_words() docs: https://developer.wordpress.org/reference/functions/wp_trim_words/
?>

eclarrrk

<!-- From https://glitch.com/edit/#!/zesty-soybean?path=script.js%3A31%3A0 -->
<link rel="icon" href="<?php echo get_stylesheet_directory_uri(); ?>/path/to/favicon-light.png"
      id="light-scheme-icon">
<link rel="icon" href="<?php echo get_stylesheet_directory_uri(); ?>/path/to/favicon-dark.png"
      id="dark-scheme-icon">

<script>
function setupIcons() {
    const lightSchemeIcon = document.querySelector('link#light-scheme-icon');
    const darkSchemeIcon = document.querySelector('link#dark-scheme-icon');

eclarrrk

/* selects every element with an ID */
[id] {
  /* adds scroll margin to the top of an element when linked to */
    scroll-margin-top: 2rem;
}

eclarrrk

<?php
$cookie_name = "banner";
if(!isset($_COOKIE[$cookie_name])) :
?>

<div class="banner">
  <!-- your content -->
  <button onclick="alertClose()" aria-label="Close">
    <span role="presentation">&#10005;</span>
  </button>

eclarrrk

<p>Get the contents of <code>/wp-content/themes/webguard-ra-theme/sass/typography/_font-size.scss</code></p>

<pre class="has-small-font-size" id="myelement"></pre>
Using this code: 
<pre class="has-small-font-size">
$( document ).ready(function() {  
  jQuery.get("/wp-content/themes/webguard-ra-theme/sass/typography/_font-size.scss", undefined, function(data) {
    $('#myelement').append(data);
  }, "html");
});</pre>

eclarrrk

<?php if( have_rows('gallery') ): ?>

<div class="gallery">

    <?php while( have_rows('gallery') ): the_row(); ?>
    
    <div class="gallery__row" style="display: flex;">
        
        <?php if( have_rows('image_row') ): ?>
        <?php while( have_rows('image_row') ): the_row(); ?>

eclarrrk

/* This is the default headline size. */
.headline,
.headline--normal {
    font-size: 2em;
}
/* When the headline is shorter, make the font-size larger */
.headline--short {
    font-size: 2.5em;
}
/* When the headline is longer, make the font-size smaller */

eclarrrk

//using PHP
<?php echo date('Y'); ?>

// using javascript
<span id="year"></span>
<script>
    document.getElementById("year").innerHTML = new Date().getFullYear();
</script>