Skip to content

Commit 0b5cbf6

Browse files
PatelUtkarshPatelUtkarsh
committed
Allow hiding title
1 parent 5c93ed3 commit 0b5cbf6

File tree

7 files changed

+289
-5
lines changed

7 files changed

+289
-5
lines changed

‎theme/assets/css/src/front-end.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,3 +25,6 @@
2525
@import "./base/index.css";
2626
@import "./templates/index.css";
2727
@import "./components/index.css";
28+
29+
/* Block editor */
30+
@import "./../../src/block-editor/plugins/hide-sections/style.css";

‎theme/assets/src/block-editor/index.js‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
/**
2+
* Copyright 2020 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
import './plugins/hide-sections';

‎theme/assets/src/block-editor/plugins/hide-sections/index.js‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
/**
2+
* Copyright 2020 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
/**
18+
* Wordpress Dependencies
19+
*/
20+
import { registerPlugin } from '@wordpress/plugins';
21+
import { PluginDocumentSettingPanel } from '@wordpress/edit-post';
22+
import { Icon, CheckboxControl } from '@wordpress/components';
23+
import { __ } from '@wordpress/i18n';
24+
import { compose, ifCondition } from '@wordpress/compose';
25+
import { withSelect, withDispatch } from '@wordpress/data';
26+
import { useState } from '@wordpress/element';
27+
28+
function HideSection( { settings, updateSectionsSettings } ) {
29+
/**
30+
* If you add a new property here, make sure to also add it
31+
* in the "properties" array at block-editor.php.
32+
*/
33+
const settingsOptionsInitial = [
34+
{
35+
label: __( 'Hide Title', 'material' ),
36+
key: 'title',
37+
},
38+
];
39+
40+
settingsOptionsInitial.forEach( settingOption => {
41+
settingOption.value = settings[ settingOption.key ]
42+
? settings[ settingOption.key ]
43+
: false;
44+
} );
45+
46+
const [ settingsOptions, setSettingOptions ] = useState(
47+
settingsOptionsInitial
48+
);
49+
50+
return (
51+
<PluginDocumentSettingPanel
52+
name="sections-control"
53+
title={ __( 'Hide Sections', 'material' ) }
54+
className="custom-panel"
55+
>
56+
{ settingsOptions.map( settingOption => {
57+
return (
58+
<CheckboxControl
59+
checked={
60+
settings[ settingOption.key ]
61+
? settings[ settingOption.key ]
62+
: false
63+
}
64+
onChange={ state => {
65+
const newSettings = { ...settings };
66+
newSettings[ settingOption.key ] = state;
67+
const newSettingsOptions = settingsOptions;
68+
newSettingsOptions.forEach( newSettingOption => {
69+
if ( newSettingOption.key === settingOption.key ) {
70+
newSettingOption.value = state;
71+
}
72+
} );
73+
updateSectionsSettings( newSettings );
74+
setSettingOptions( newSettingsOptions );
75+
} }
76+
label={ settingOption.label }
77+
key={ settingOption.key }
78+
/>
79+
);
80+
} ) }
81+
</PluginDocumentSettingPanel>
82+
);
83+
}
84+
85+
const WrappedSectionControl = compose( [
86+
withSelect( select => {
87+
const { getCurrentPostType } = select( 'core/editor' );
88+
const { getPostType } = select( 'core' );
89+
return {
90+
postTypeObj: getPostType( getCurrentPostType() ),
91+
};
92+
} ),
93+
ifCondition( ( { postTypeObj } ) => {
94+
return postTypeObj?.supports?.[ 'custom-fields' ];
95+
} ),
96+
withSelect( select => {
97+
const { getEditedPostAttribute } = select( 'core/editor' );
98+
return {
99+
settings: getEditedPostAttribute( 'meta' )[ 'material-hide-sections' ],
100+
};
101+
} ),
102+
withDispatch( dispatch => {
103+
return {
104+
updateSectionsSettings( settings ) {
105+
dispatch( 'core/editor' ).editPost( {
106+
meta: { 'material-hide-sections': settings },
107+
} );
108+
},
109+
};
110+
} ),
111+
ifCondition( ( { settings } ) => {
112+
return !! settings;
113+
} ),
114+
] )( HideSection );
115+
116+
registerPlugin( 'material-hide-sections', {
117+
render: WrappedSectionControl,
118+
icon: <Icon icon="admin-customizer" />,
119+
} );

‎theme/assets/src/block-editor/plugins/hide-sections/style.css‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
/**
2+
* Copyright 2020 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
.has-hide-title {
18+
.entry-title {
19+
display: none;
20+
}
21+
22+
.-has-tab-bar + .site-content .content-area {
23+
margin-top: 7rem;
24+
}
25+
26+
.-has-tab-bar + .site-content .content-area {
27+
@media (max-width: 599px) {
28+
margin-top: 6rem;
29+
}
30+
}
31+
32+
.entry-content .wp-block-cover:first-child {
33+
margin-top: 0;
34+
}
35+
}

‎theme/functions.php‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -253,10 +253,16 @@ function material_is_plugin_active() {
253253
require get_template_directory() . '/inc/widgets/class-wp-widget-rss.php';
254254
require get_template_directory() . '/inc/widgets.php';
255255

256+
/**
257+
* Block editor.
258+
*/
259+
require get_template_directory() . '/inc/block-editor.php';
260+
256261
MaterialDesign\Theme\Admin\setup();
257262
MaterialDesign\Theme\Customizer\setup();
258263
MaterialDesign\Theme\Customizer\Colors\setup();
259264
MaterialDesign\Theme\Customizer\Header_Footer\setup();
260265
MaterialDesign\Theme\Customizer\Layout\setup();
261266
MaterialDesign\Theme\Customizer\Menu\setup();
262267
MaterialDesign\Theme\Widgets\setup();
268+
MaterialDesign\Theme\BlockEditor\setup();

‎theme/inc/block-editor.php‎

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
<?php
2+
/**
3+
* Copyright 2020 Google LLC
4+
*
5+
* Licensed under the Apache License, Version 2.0 (the "License");
6+
* you may not use this file except in compliance with the License.
7+
* You may obtain a copy of the License at
8+
*
9+
* http://www.apache.org/licenses/LICENSE-2.0
10+
*
11+
* Unless required by applicable law or agreed to in writing, software
12+
* distributed under the License is distributed on an "AS IS" BASIS,
13+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14+
* See the License for the specific language governing permissions and
15+
* limitations under the License.
16+
*
17+
* @package MaterialDesign
18+
*/
19+
20+
namespace MaterialDesign\Theme\BlockEditor;
21+
22+
/**
23+
* Add hooks and filters.
24+
*/
25+
function setup() {
26+
add_action( 'init', __NAMESPACE__ . '\\register_disable_section_meta' );
27+
add_action( 'enqueue_block_editor_assets', __NAMESPACE__ . '\\enqueue_block_editor_assets' );
28+
add_action( 'body_class', __NAMESPACE__ . '\\filter_body_class' );
29+
}
30+
31+
/**
32+
* Register disable section meta.
33+
*/
34+
function register_disable_section_meta() {
35+
register_post_meta(
36+
'',
37+
'material-hide-sections',
38+
[
39+
'type' => 'object',
40+
'description' => 'Whether the title should be shown in frontend.',
41+
'object_type' => 'post',
42+
'single' => true,
43+
'default' => [],
44+
'show_in_rest' => [
45+
'schema' => [
46+
'type' => 'object',
47+
/**
48+
* If you add a new property here, make sure to also add it
49+
* in the "settingsOptionsInitial" object here:
50+
* assets/src/js/block-editor/plugins/hide-sections/index.js
51+
*/
52+
'properties' => [
53+
'title' => [ 'type' => 'boolean' ],
54+
],
55+
'additionalProperties' => [
56+
'type' => 'boolean',
57+
],
58+
],
59+
],
60+
]
61+
);
62+
}
63+
64+
/**
65+
* Enqueue block editor assets.
66+
*/
67+
function enqueue_block_editor_assets() {
68+
$asset_file = get_stylesheet_directory() . '/assets/js/block-editor.asset.php';
69+
$asset = is_readable( $asset_file ) ? require $asset_file : [];
70+
$version = isset( $asset['version'] ) ? $asset['version'] : wp_get_theme()->get( 'Version' );
71+
$dependencies = isset( $asset['dependencies'] ) ? $asset['dependencies'] : [];
72+
73+
wp_enqueue_script(
74+
'material-block-editor-js-theme',
75+
get_stylesheet_directory_uri() . '/assets/js/block-editor.js',
76+
$dependencies,
77+
$version,
78+
false
79+
);
80+
}
81+
82+
/**
83+
* Filter body class.
84+
*
85+
* @param array $classes Body class.
86+
*
87+
* @return array
88+
*/
89+
function filter_body_class( $classes ) {
90+
if ( is_single() || is_page() ) {
91+
$meta = get_post_meta( get_the_ID(), 'material-hide-sections', true );
92+
if ( ! empty( $meta['title'] ) ) {
93+
$classes[] = 'has-hide-title';
94+
}
95+
}
96+
97+
return $classes;
98+
}

‎webpack.config.js‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,11 @@ const assets = {
147147
],
148148
},
149149
},
150+
{
151+
name: 'Block Editor',
152+
chunk: 'block-editor',
153+
entry: [ './theme/assets/src/block-editor/index.js' ],
154+
},
150155
{
151156
name: 'Front End',
152157
chunk: 'front-end',
@@ -163,7 +168,7 @@ const assets = {
163168
],
164169
};
165170

166-
const getSharedConfig = packageType => {
171+
const getSharedConfig = ( packageType, isBlockEditor ) => {
167172
const config = {
168173
...defaultConfig,
169174
...{
@@ -212,7 +217,7 @@ const getSharedConfig = packageType => {
212217
// Remove the CleanWebpackPlugin and FixStyleWebpackPlugin plugins from `@wordpress/scripts` due to version conflicts.
213218
...defaultConfig.plugins.filter(
214219
plugin =>
215-
packageType === 'plugin' &&
220+
( isBlockEditor || packageType === 'plugin' ) &&
216221
! [ 'CleanWebpackPlugin', 'FixStyleWebpackPlugin' ].includes(
217222
plugin.constructor.name
218223
)
@@ -247,7 +252,8 @@ const getSharedConfig = packageType => {
247252
const webpackConfigs = [];
248253
Object.keys( assets ).forEach( packageType => {
249254
assets[ packageType ].forEach( asset => {
250-
const config = getSharedConfig( packageType );
255+
const isBlockEditor = asset.chunk === 'block-editor';
256+
const config = getSharedConfig( packageType, isBlockEditor );
251257
config.entry = Array.isArray( asset.entry )
252258
? {
253259
[ asset.chunk ]: asset.entry,
@@ -291,13 +297,13 @@ Object.keys( assets ).forEach( packageType => {
291297
];
292298
}
293299

294-
if ( asset.chunk === 'block-editor' ) {
300+
if ( isBlockEditor && packageType === 'plugin' ) {
295301
config.plugins = [
296302
...config.plugins,
297303
new CopyWebpackPlugin( {
298304
patterns: [
299305
{
300-
from: './plugin/assets/src/block-editor/blocks/*/block.json',
306+
from: `./${ packageType }/assets/src/block-editor/blocks/*/block.json`,
301307
to: './blocks/[1]/block.json',
302308
transformPath( targetPath, absolutePath ) {
303309
const matches = absolutePath.match(

0 commit comments

Comments
 (0)