Skip to content

Instantly share code, notes, and snippets.

View webmandesign's full-sized avatar
👋
Creating inclusive WordPress themes

Oliver Juhas webmandesign

👋
Creating inclusive WordPress themes
61 followers · 6 following
View GitHub Profile
@webmandesign
webmandesign / SassMeister-input-HTML.html
Created June 15, 2015 08:13
Generated by SassMeister.com.
<div class="laptop-container">
<img src="http://placehold.it/640x360/3333cc/ffffff" alt="" />
</div>
@webmandesign
webmandesign / dummy-form-to-cf7.html
Last active October 28, 2017 09:47
Convert WebMan dummy form to Contact Form 7
<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 / beaver-builder-css-class-selector.php
Last active May 3, 2023 16:44
Beaver Builder 2.1.4+ CSS class selector integration
<?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 / reset-addon.css
Last active August 3, 2018 10:21
Additional minimal WP theme reset used besides Normalize.css.
/**
* Basic elements spacing.
*/
p:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
@webmandesign
webmandesign / example-theme-basic-styles.css
Last active August 3, 2018 10:55
Mimicking a perfect example WP theme basic styles.
/**
* Colors.
*/
body {
background: #222;
color: #ccc;
}
h1, h2, h3, h4, h5, h6 {
@webmandesign
webmandesign / gutenberg-wide-alignement-wrapper.php
Last active September 9, 2020 17:14
Wrapping aligned Gutenberg blocks with additional div on a WordPress website front-end.
<?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 / gutenberg-content-sections.php
Last active February 6, 2021 03:10
Wrapping post content in section divs similar to Medium.com. Section split occurs on Gutenberg wide and full aligned blocks.
<?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 / wordpress-locate-template.php
Last active December 8, 2018 18:58
Can we use `locate_template()` for other than "Template files"?
<?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 / class-file.php
Last active December 8, 2018 19:07
WordPress theme file locator and loader.
<?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 / eimear-demo-page.html
Created November 29, 2021 14:41
Eimear theme demo page content
<!-- wp:cover {"url":"https://themedemos.webmandesign.eu/eimear/wp-content/uploads/sites/27/SAMPLE/_lauren-fleischmann-ul3oHG_LzcE-unsplash.jpg","id":211,"hasParallax":true,"dimRatio":0,"align":"full","className":"has-no-margin-bottom"} -->
<div class="wp-block-cover alignfull has-parallax has-no-margin-bottom" style="background-image:url(https://themedemos.webmandesign.eu/eimear/wp-content/uploads/sites/27/SAMPLE/_lauren-fleischmann-ul3oHG_LzcE-unsplash.jpg)"><div class="wp-block-cover__inner-container"><!-- wp:spacer {"height":120} -->
<div style="height:120px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->
<!-- wp:columns {"verticalAlignment":"bottom","align":"wide","className":"has-phi-screen-min-height"} -->
<div class="wp-block-columns alignwide are-vertically-aligned-bottom has-phi-screen-min-height"><!-- wp:column {"verticalAlignment":"bottom","className":"has-no-margin"} -->
<div class="wp-block-column is-vertically-aligned-bottom has-no-margin"></div>
<!-- /wp:column -->