Skip to content

Instantly share code, notes, and snippets.

💚
Making WordPress themes accessible

Oliver Juhas webmandesign

💚
Making WordPress themes accessible
Block or report user

Report or block webmandesign

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@webmandesign
webmandesign / class-file.php
Last active Dec 8, 2018
WordPress theme file locator and loader.
View class-file.php
<?php
/**
* File Class
*
* Helper class to locate and load files in child/parent
* theme only if they exist.
*
* Rename "Themeslug" according to your needs.
* Edit according to your needs...
*/
@webmandesign
webmandesign / wordpress-locate-template.php
Last active Dec 8, 2018
Can we use `locate_template()` for other than "Template files"?
View wordpress-locate-template.php
<?php
/**
* We need to load this file only if it exists:
* - first checking in child theme,
* - then trying parent theme.
*/
$file_path_relative = 'assets/css/for-processing.css';
/**
@webmandesign
webmandesign / gutenberg-content-sections.php
Last active Aug 29, 2018
Wrapping post content in section divs similar to Medium.com. Section split occurs on Gutenberg wide and full aligned blocks.
View gutenberg-content-sections.php
<?php
/**
* Creates section divs in the content area.
*
* This is a front-end solution only.
* Splits content into section containers, similar to Medium.com.
* Section split occurs on Gutenberg wide and full aligned blocks.
*
* Copy this function into your WordPress theme's `functions.php` file
@webmandesign
webmandesign / gutenberg-wide-alignement-wrapper.php
Last active Aug 23, 2019
Wrapping aligned Gutenberg blocks with additional div on a WordPress website front-end.
View gutenberg-wide-alignement-wrapper.php
<?php
// IMPORTANT UPDATE 20190307:
// Since WordPress 5.0.0 we can actually use much simpler solution:
/**
* Applies wrapper div around aligned blocks.
*
* Copy this function into your WordPress theme's `functions.php` file
* and change the `themeprefix` accordingly.
@webmandesign
webmandesign / example-theme-basic-styles.css
Last active Aug 3, 2018
Mimicking a perfect example WP theme basic styles.
View example-theme-basic-styles.css
/**
* Colors.
*/
body {
background: #222;
color: #ccc;
}
h1, h2, h3, h4, h5, h6 {
@webmandesign
webmandesign / reset-addon.css
Last active Aug 3, 2018
Additional minimal WP theme reset used besides Normalize.css.
View reset-addon.css
/**
* Basic elements spacing.
*/
p:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
@webmandesign
webmandesign / beaver-builder-css-class-selector.php
Last active Aug 1, 2018
Beaver Builder 2.1.4+ CSS class selector integration
View beaver-builder-css-class-selector.php
<?php
// START COPYING HERE...
// Requires Beaver Builder v2.1.4 and newer!
/**
* Populates CSS classes dropdown selector with custom classes selection.
*
* Hooks onto `fl_builder_field_js_config` filter hook. See Beaver Builder code directly
* for filter hook attributes (in `classes/class-fl-builder-ui-settings-forms.php` file).
@webmandesign
webmandesign / dummy-form-to-cf7.html
Last active Oct 28, 2017
Convert WebMan dummy form to Contact Form 7
View dummy-form-to-cf7.html
<p style="width: 48%; float: left;" class="fullwidth">
<label class="screen-reader-text" for="form-name">Your name</label>
[text name id:form-name placeholder "Your name"]
</p>
<p style="width: 48%; float: right;" class="fullwidth">
<label class="screen-reader-text" for="form-email">Your email</label>
[email email id:form-email placeholder "Your email"]
</p>
<p style="clear: both;" class="fullwidth">
<label class="screen-reader-text" for="form-message">Your message</label>
@webmandesign
webmandesign / SassMeister-input-HTML.html
Created Jun 15, 2015
Generated by SassMeister.com.
View SassMeister-input-HTML.html
<div class="laptop-container">
<img src="http://placehold.it/640x360/3333cc/ffffff" alt="" />
</div>
You can’t perform that action at this time.