Skip to content

[my-wordpress] Redesign welcome + About content; serve Welcome as static front page #209

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
iamtakashi wants to merge 1 commit into
base: trunk
Choose a base branch
from
Open

[my-wordpress] Redesign welcome + About content; serve Welcome as static front page #209

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
108 changes: 71 additions & 37 deletions blueprints/my-wordpress/plugin/about.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,77 +1,107 @@
<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">This is a real WordPress, running entirely in your browser. No server, no account, no data leaving your machine.</p>
<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40"}}},"fontSize":"large"} -->
<p class="has-large-font-size" style="margin-top:var(--wp--preset--spacing--40)">A real WordPress running entirely in your browser. No server, no account, no data leaving your machine.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading">How is this possible?</h2>
<!-- wp:heading {"style":{"spacing":{"margin":{"top":"var:preset|spacing|50"}}}} -->
<h2 class="wp-block-heading" style="margin-top:var(--wp--preset--spacing--50)">How it works</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>This WordPress runs through <a href="https://wordpress.org/playground/">WordPress Playground</a>, a technology that lets WordPress run directly in your browser using WebAssembly. Your content is stored in your browser's local storage.</p>
<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">The site runs through <a href="https://wordpress.org/playground/">WordPress Playground</a>, a technology that lets WordPress run directly in your browser via WebAssembly. Your content is stored in your browser's local storage.</p>
<!-- /wp:paragraph -->

<!-- wp:separator {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}}} -->
<hr class="wp-block-separator has-alpha-channel-opacity" style="margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40)"/>
<!-- /wp:separator -->

<!-- wp:heading -->
<h2 class="wp-block-heading">What makes this different</h2>
<h2 class="wp-block-heading">What's different</h2>
<!-- /wp:heading -->

<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li><strong>Truly private</strong> — Your data never touches a server. It exists only on your device, in your browser.</li>
<!-- /wp:list-item -->
<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Private by default</h3>
<!-- /wp:heading -->

<!-- wp:list-item -->
<li><strong>No account needed</strong> — No signup, no email, no password to remember. Just open the page and it's yours.</li>
<!-- /wp:list-item -->
<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">Your data never touches a server. It exists only on your device.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:list-item -->
<li><strong>Completely free</strong> — No hosting costs, no subscriptions, no catches.</li>
<!-- /wp:list-item -->
<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">No account</h3>
<!-- /wp:heading -->

<!-- wp:list-item -->
<li><strong>Full WordPress</strong> — This isn't a limited demo. Install plugins, change themes, customize everything.</li>
<!-- /wp:list-item --></ul>
<!-- /wp:list -->
<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">No signup, no email, no password.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Free</h3>
<!-- /wp:heading -->

<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">No hosting costs, no subscriptions, no catches.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Full WordPress</h3>
<!-- /wp:heading -->

<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">This is not a demo. Install plugins, change themes, and customize everything.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:separator {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}}} -->
<hr class="wp-block-separator has-alpha-channel-opacity" style="margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40)"/>
<!-- /wp:separator -->

<!-- wp:heading -->
<h2 class="wp-block-heading">Ideas for using it</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Because it's private and persistent, this WordPress works well for things you might not publish:</p>
<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">Because it's private and persistent, it works well for things you'd rather not publish:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<!-- wp:list {"fontSize":"medium"} -->
<ul class="wp-block-list has-medium-font-size"><!-- wp:list-item -->
<li>A personal journal or daily notes</li>
<!-- /wp:list-item -->

<!-- wp:list-item -->
<li>Draft posts before publishing elsewhere</li>
<li>Drafts before publishing elsewhere</li>
<!-- /wp:list-item -->

<!-- wp:list-item -->
<li>Collecting recipes, bookmarks, or research</li>
<li>Recipes, bookmarks, or research</li>
<!-- /wp:list-item -->

<!-- wp:list-item -->
<li>Learning WordPress without risk</li>
<!-- /wp:list-item -->

<!-- wp:list-item -->
<li>A private space to organize your thoughts</li>
<li>A quiet space to think</li>
<!-- /wp:list-item --></ul>
<!-- /wp:list -->

<!-- wp:separator {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}}} -->
<hr class="wp-block-separator has-alpha-channel-opacity" style="margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40)"/>
<!-- /wp:separator -->

<!-- wp:heading -->
<h2 class="wp-block-heading">Learn WordPress</h2>
<h2 class="wp-block-heading">Learn more</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Want to learn more about what WordPress can do?</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<!-- wp:list {"fontSize":"medium"} -->
<ul class="wp-block-list has-medium-font-size"><!-- wp:list-item -->
<li><a href="https://wordpress.org/documentation/">WordPress Documentation</a> — Official guides and tutorials</li>
<!-- /wp:list-item -->

Expand All @@ -84,10 +114,14 @@ <h2 class="wp-block-heading">Learn WordPress</h2>
<!-- /wp:list-item --></ul>
<!-- /wp:list -->

<!-- wp:separator {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}}} -->
<hr class="wp-block-separator has-alpha-channel-opacity" style="margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40)"/>
<!-- /wp:separator -->

<!-- wp:heading -->
<h2 class="wp-block-heading">When you're ready for more</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>This browser-based WordPress is great for personal use. When you want to access your site from multiple devices, share it publicly, or collaborate with others, you can export everything and move to hosted WordPress. What you build here comes with you.</p>
<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">Ready to go further? Move to hosted WordPress whenever you want. Everything you've built comes with you.</p>
<!-- /wp:paragraph -->
0 .../my-wordpress/plugin/de/welcome-post.html → ...rints/my-wordpress/plugin/de/welcome.html
View file
Open in desktop
File renamed without changes.
0 .../my-wordpress/plugin/es/welcome-post.html → ...rints/my-wordpress/plugin/es/welcome.html
View file
Open in desktop
File renamed without changes.
0 .../my-wordpress/plugin/pl/welcome-post.html → ...rints/my-wordpress/plugin/pl/welcome.html
View file
Open in desktop
File renamed without changes.
35 changes: 22 additions & 13 deletions blueprints/my-wordpress/plugin/playground-welcome.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
/**
* Plugin Name: Playground Welcome
* Description: Replaces the default Hello World post and Sample Page with welcome content for WordPress Playground.
* Version: 1.1.0
* Version: 1.2.0
* Author: Playground
* License: GPL-2.0+
* Text Domain: playground-welcome
Expand Down Expand Up @@ -33,44 +33,53 @@ private function maybe_setup_content() {

add_filter('wp_kses_allowed_html', [__CLASS__, 'allow_svg_tags']);

$post = get_post(1);
if ($post) {
$welcome = get_post(1);
if ($welcome) {
wp_update_post([
'ID' => $post->ID,
'ID' => $welcome->ID,
'post_type' => 'page',
'post_title' => __('Welcome to Your WordPress', 'playground-welcome'),
'post_content' => self::get_welcome_post_content(),
'post_content' => self::get_welcome_content(),
'post_name' => 'welcome-to-your-wordpress',
'comment_status' => 'closed',
'ping_status' => 'closed',
]);
wp_delete_comment(1, true);
}

$sample_page = get_post(2);
if ($sample_page) {
$about = get_post(2);
if ($about) {
wp_update_post([
'ID' => $sample_page->ID,
'ID' => $about->ID,
'post_title' => __('About this WordPress', 'playground-welcome'),
'post_content' => self::get_about_page_content(),
'post_name' => 'about',
]);
}

if ($welcome) {
update_option('show_on_front', 'page');
update_option('page_on_front', (int) $welcome->ID);
}

update_option($this->content_created_option, true);
}

public static function get_welcome_post_path() {
public static function get_welcome_path() {
$locale = determine_locale();
$lang = substr($locale, 0, 2);
$plugin_dir = plugin_dir_path(__FILE__);

$localized_file = $plugin_dir . $lang . '/welcome-post.html';
$localized_file = $plugin_dir . $lang . '/welcome.html';
if (file_exists($localized_file)) {
return $localized_file;
}

return $plugin_dir . 'welcome-post.html';
return $plugin_dir . 'welcome.html';
}

public static function get_welcome_post_content() {
$path = self::get_welcome_post_path();
public static function get_welcome_content() {
$path = self::get_welcome_path();
if (file_exists($path)) {
return file_get_contents($path);
}
Expand Down
Loading
Loading