SlideShare une entreprise Scribd logo
1  sur  19
WordPress Gutenberg Tutorial
Quick Overview:
This website editor was named after Johannes Gensfleisch zur
Laden zum Gutenberg, who was a German blacksmith, goldsmith,
printer, and publisher who also introduced printing to Europe with
the printing press. Depending on how often you use WordPress to
build websites from scratch or just want to upgrade yours from one
platform to another, you may or may not already be familiar with the
upcoming WordPress Gutenberg editor. But you can learn the bulk
of its information and how to use it via the WordPress Gutenberg
tutorial.
What is Gutenberg?
Gutenberg, the long and the short of it, is the next generation
website editor which will be replacing the previous (albeit cool)
website editor, the TinyMCE. It is the current WYSIWYG text editor
where you write your posts and pages. Despite the hype of the
website editor giving websites an aesthetic update, it will actually do
a lot more than that, because it is going to radically change the
editing experience of web designers and enthusiasts alike! It will do
this by moving from single edit field to a block-based approach
when creating content.
Release Date for the Gutenberg?
Gutenberg is expected to be released this year, 2018, and to
become officially a part of the WordPress core which will come out
together with the WordPress 5.0. Unfortunately, WordPress hasn’t
revealed the exact date of the release, so it’s up for speculation;
however, the Gutenberg editor is already causing a major hype in
the mainstream media. It’s actually a good idea for the WordPress
core team to keep things vague with the launch of the Gutenberg as
it will give them enough time to fix everything to perfection.
How the WordPress Gutenberg Editor Works
Now that we’ve gotten the basic introductions out of the
way, we can then proceed to tackle the intricacies of how
the WordPress Gutenberg editor works. The developers
wanted the Gutenberg to handle complex tasks while
making it very user-friendly to you, so that website editing
will feel like a breeze even for beginners. It’s actually a very
interesting idea to discuss.
Block-Based Editing 101
Basically, the Gutenberg differs from the current WordPress
TinyMCE editor by replacing the single edit field with a lot of
individual “blocks.” From what we’ve learned, these blocks will allow
you to build more complex designs compared with the limitations
from the previous website editor. The WordPress Gutenberg editor
therefore is a huge step towards simplification in web design and
general web editing.
What is a Block?
Whether in layman’s terms or in technical-specific, a block is a general term used for
almost anything. A block could be used for:
• Regular text
• Images
• Video embeds
• Buttons
• Widgets (yes, those same widgets you use in your sidebar)
• Tables
And just like the TinyMCE editor where you can download and install plugins the
Gutenberg editor also has room for open source plugins that will be added as
succeeding blocks on the dashboard. The WordPress plugins Gutenberg will give
you more flexibility as you build your site onto a more comprehensive level. Each
block is independent from the other blocks, therefore you can customize them
separately and the other blocks or sections on your website won’t be affected.
Can Gutenberg be Considered as a Page Builder?
Unfortunately, Gutenberg in its current form cannot yet be
considered as a page builder. Remember when we told you that it
WILL become an all-in-one website editor? Well, upon its release it
will be in its basic form and it will need to evolve further down the
road as the core developers will encounter new ideas from time to
time. I think that when it comes out any time soon this year even the
WordPress Gutenberg tutorial will emphasize on it not being an
immediate replacement for page builder apps.
How to Install Gutenberg?
First make sure that you have the WordPress version 4.8 before
downloading and installing the Gutenberg website editor. You can
find the WordPress plugins Gutenberg by doing a Google search –
this should lead you directly to the WordPress repository – or you
can download it from your WordPress dashboard under “Add New”
plugins tab. Keep in mind to install this plugin on a test site to avoid
any errors.
Pros of WordPress Gutenberg Editor
• Plays a role as a central hub where core developers, theme developers, plugins, and the
website editor could integrate and work as one.
• Learn it once and use it everywhere.
• Publishers will likely favor it better than the TinyMCE and other website editors that have
come before.
• Gutenberg provides a less distracting experience with more screen space.
• Blocks help you customize your site better and the new alignment options allow for full-width
template sites to have their users view larger resolution screens. It’s also very responsive.
• Works well on mobile devices.
• Theme and plugin developers will have the ability to create their own custom blocks.
• Designed for people who does not have any web design experience and beginners will find it
very easy to use.
Cons of WordPress Gutenberg Editor
• Unable to support Markdown in its current form.
• Although it has been designed to make it easier for beginners to learn, some may
still have a hard time learning it.
• Gutenberg website editor gained the ability to support meta boxes as of October
2017; however, it still needs further development. But as a bonus SEO Yoast is also
fully supported.
• The developers did not enable the editor to support responsive columns yet. This
may prompt users to install shortcode/visual builder plugins to compensate. The
core team definitely has to include this as soon as possible or they will get tons of
complain for something that’s almost trivial.
• Another issue with the Gutenberg is that there have been hundreds of thousands of
themes and plugins that were created for the TinyMCE editor. Once the Gutenberg
is released, then all those themes and plugins will most likely encounter backwards
compatibility problems and the developers will have to update them in order to be
Accessibility issues.
WordPress Gutenberg version 2.3.0
You may want to start exploring the WordPress Gutenberg version
2.3.0 now and see what you can do with your test website. If
everything goes well, then you can even publish your new site
immediately! You will absolutely love it as it is easier to build and
customize your website than with the previous TinyMCE editor. In 1-
2 years from now the WordPress Gutenberg website editor will be
completely different and will be able to support so many other apps,
themes and plugins and it will be far superior than all the other
editors that have come before it!
Thank You
https://www.wpenlight.com

Contenu connexe

Tendances

Question 6 A-level Media evaluation
Question 6 A-level Media evaluationQuestion 6 A-level Media evaluation
Question 6 A-level Media evaluationNathan Gilbert
 
Jetpack wordpress plugin guide for beginners | Install & Configuration
Jetpack wordpress plugin guide for beginners | Install & ConfigurationJetpack wordpress plugin guide for beginners | Install & Configuration
Jetpack wordpress plugin guide for beginners | Install & ConfigurationMd Faruk Khan
 
Question 4 Evaluation
Question 4 EvaluationQuestion 4 Evaluation
Question 4 Evaluationxmaddie
 
Question 4 Evaluation
Question 4 EvaluationQuestion 4 Evaluation
Question 4 Evaluationbethanyalice
 
Evaluation Q6
Evaluation Q6Evaluation Q6
Evaluation Q6bilal-m
 
Quicktime powerpoint prezi
Quicktime powerpoint preziQuicktime powerpoint prezi
Quicktime powerpoint preziJonesbethany
 
Q6: what have you learnt about the technologies from the process of construct...
Q6: what have you learnt about the technologies from the process of construct...Q6: what have you learnt about the technologies from the process of construct...
Q6: what have you learnt about the technologies from the process of construct...millanasmedia
 
Media evaluation quesion 4
Media evaluation quesion 4Media evaluation quesion 4
Media evaluation quesion 4jackahern11
 
How did you use new media technologies in the construction and research, plan...
How did you use new media technologies in the construction and research, plan...How did you use new media technologies in the construction and research, plan...
How did you use new media technologies in the construction and research, plan...john_swarvay
 

Tendances (16)

Evaluation 4
Evaluation 4Evaluation 4
Evaluation 4
 
Question 6 A-level Media evaluation
Question 6 A-level Media evaluationQuestion 6 A-level Media evaluation
Question 6 A-level Media evaluation
 
Jetpack wordpress plugin guide for beginners | Install & Configuration
Jetpack wordpress plugin guide for beginners | Install & ConfigurationJetpack wordpress plugin guide for beginners | Install & Configuration
Jetpack wordpress plugin guide for beginners | Install & Configuration
 
Evaluation 4
Evaluation 4Evaluation 4
Evaluation 4
 
Question 4 Evaluation
Question 4 EvaluationQuestion 4 Evaluation
Question 4 Evaluation
 
Technologies I used
Technologies I usedTechnologies I used
Technologies I used
 
Question 4 Evaluation
Question 4 EvaluationQuestion 4 Evaluation
Question 4 Evaluation
 
Evaluation Q6
Evaluation Q6Evaluation Q6
Evaluation Q6
 
Question 4 - A2
Question 4 - A2Question 4 - A2
Question 4 - A2
 
Quicktime powerpoint prezi
Quicktime powerpoint preziQuicktime powerpoint prezi
Quicktime powerpoint prezi
 
Q6: what have you learnt about the technologies from the process of construct...
Q6: what have you learnt about the technologies from the process of construct...Q6: what have you learnt about the technologies from the process of construct...
Q6: what have you learnt about the technologies from the process of construct...
 
Media evaluation quesion 4
Media evaluation quesion 4Media evaluation quesion 4
Media evaluation quesion 4
 
How did you use new media technologies in the construction and research, plan...
How did you use new media technologies in the construction and research, plan...How did you use new media technologies in the construction and research, plan...
How did you use new media technologies in the construction and research, plan...
 
Question 6
Question 6Question 6
Question 6
 
Q6 edited
Q6 edited Q6 edited
Q6 edited
 
Q6
Q6Q6
Q6
 

Similaire à Word press gutenberg tutorial

What needs to be taken care before updating word press 5.0?
What needs to be taken care before updating word press 5.0?What needs to be taken care before updating word press 5.0?
What needs to be taken care before updating word press 5.0?Elsner Technologies Pvt Ltd
 
Gutenberg word press
Gutenberg word pressGutenberg word press
Gutenberg word pressManev Dave
 
An (Updated) Introduction to Gutenberg
An (Updated) Introduction to GutenbergAn (Updated) Introduction to Gutenberg
An (Updated) Introduction to GutenbergAndrew Marks
 
Embracing the Change: How to Win with Gutenberg
Embracing the Change: How to Win with GutenbergEmbracing the Change: How to Win with Gutenberg
Embracing the Change: How to Win with GutenbergWP Engine
 
Learn word press-from-scratch
Learn word press-from-scratchLearn word press-from-scratch
Learn word press-from-scratchEmma Page
 
WordPress.pptx
WordPress.pptxWordPress.pptx
WordPress.pptxChandlalu
 
Benefit Of Wordpress
Benefit Of WordpressBenefit Of Wordpress
Benefit Of WordpressTheawaster485
 
Kick start your career with WordPress
Kick start your career with WordPressKick start your career with WordPress
Kick start your career with WordPressJignasa Naik
 
The User Experience and Accessibility of Gutenberg
The User Experience and Accessibility of Gutenberg The User Experience and Accessibility of Gutenberg
The User Experience and Accessibility of Gutenberg Claire Brotherton
 
Onetone theme review
Onetone theme reviewOnetone theme review
Onetone theme reviewDebbie Koury
 
Getting Ready for Gutenberg
Getting Ready for GutenbergGetting Ready for Gutenberg
Getting Ready for GutenbergChris Lema
 
The Superhero’s Method of Modern HTML5 Development by RapidValue Solutions
The Superhero’s Method of Modern HTML5 Development by RapidValue SolutionsThe Superhero’s Method of Modern HTML5 Development by RapidValue Solutions
The Superhero’s Method of Modern HTML5 Development by RapidValue SolutionsRapidValue
 
Introduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran SayedIntroduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran SayedImran Sayed
 
Budgeting 2021 Tip for WordPress Website Owners
Budgeting 2021 Tip for WordPress Website OwnersBudgeting 2021 Tip for WordPress Website Owners
Budgeting 2021 Tip for WordPress Website OwnersKaren Callahan
 
How to create tabs in web design
How to create tabs in web designHow to create tabs in web design
How to create tabs in web designChristopher Dill
 

Similaire à Word press gutenberg tutorial (20)

What needs to be taken care before updating word press 5.0?
What needs to be taken care before updating word press 5.0?What needs to be taken care before updating word press 5.0?
What needs to be taken care before updating word press 5.0?
 
Introducing gutenberg
Introducing gutenbergIntroducing gutenberg
Introducing gutenberg
 
Gutenberg word press
Gutenberg word pressGutenberg word press
Gutenberg word press
 
An (Updated) Introduction to Gutenberg
An (Updated) Introduction to GutenbergAn (Updated) Introduction to Gutenberg
An (Updated) Introduction to Gutenberg
 
Embracing the Change: How to Win with Gutenberg
Embracing the Change: How to Win with GutenbergEmbracing the Change: How to Win with Gutenberg
Embracing the Change: How to Win with Gutenberg
 
Learn word press-from-scratch
Learn word press-from-scratchLearn word press-from-scratch
Learn word press-from-scratch
 
Drupal vs wordpess
Drupal vs wordpessDrupal vs wordpess
Drupal vs wordpess
 
WordPress.pptx
WordPress.pptxWordPress.pptx
WordPress.pptx
 
Benefit Of Wordpress
Benefit Of WordpressBenefit Of Wordpress
Benefit Of Wordpress
 
Kick start your career with WordPress
Kick start your career with WordPressKick start your career with WordPress
Kick start your career with WordPress
 
937079
937079937079
937079
 
World of WordPress
World of WordPressWorld of WordPress
World of WordPress
 
The User Experience and Accessibility of Gutenberg
The User Experience and Accessibility of Gutenberg The User Experience and Accessibility of Gutenberg
The User Experience and Accessibility of Gutenberg
 
Presentation1 renan
Presentation1 renanPresentation1 renan
Presentation1 renan
 
Onetone theme review
Onetone theme reviewOnetone theme review
Onetone theme review
 
Getting Ready for Gutenberg
Getting Ready for GutenbergGetting Ready for Gutenberg
Getting Ready for Gutenberg
 
The Superhero’s Method of Modern HTML5 Development by RapidValue Solutions
The Superhero’s Method of Modern HTML5 Development by RapidValue SolutionsThe Superhero’s Method of Modern HTML5 Development by RapidValue Solutions
The Superhero’s Method of Modern HTML5 Development by RapidValue Solutions
 
Introduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran SayedIntroduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran Sayed
 
Budgeting 2021 Tip for WordPress Website Owners
Budgeting 2021 Tip for WordPress Website OwnersBudgeting 2021 Tip for WordPress Website Owners
Budgeting 2021 Tip for WordPress Website Owners
 
How to create tabs in web design
How to create tabs in web designHow to create tabs in web design
How to create tabs in web design
 

Dernier

Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)wesley chun
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘RTylerCroy
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsJoaquim Jorge
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessPixlogix Infotech
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slidevu2urc
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?Antenna Manufacturer Coco
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxMalak Abu Hammad
 

Dernier (20)

Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
 

Word press gutenberg tutorial

  • 2. Quick Overview: This website editor was named after Johannes Gensfleisch zur Laden zum Gutenberg, who was a German blacksmith, goldsmith, printer, and publisher who also introduced printing to Europe with the printing press. Depending on how often you use WordPress to build websites from scratch or just want to upgrade yours from one platform to another, you may or may not already be familiar with the upcoming WordPress Gutenberg editor. But you can learn the bulk of its information and how to use it via the WordPress Gutenberg tutorial.
  • 3.
  • 4. What is Gutenberg? Gutenberg, the long and the short of it, is the next generation website editor which will be replacing the previous (albeit cool) website editor, the TinyMCE. It is the current WYSIWYG text editor where you write your posts and pages. Despite the hype of the website editor giving websites an aesthetic update, it will actually do a lot more than that, because it is going to radically change the editing experience of web designers and enthusiasts alike! It will do this by moving from single edit field to a block-based approach when creating content.
  • 5.
  • 6. Release Date for the Gutenberg? Gutenberg is expected to be released this year, 2018, and to become officially a part of the WordPress core which will come out together with the WordPress 5.0. Unfortunately, WordPress hasn’t revealed the exact date of the release, so it’s up for speculation; however, the Gutenberg editor is already causing a major hype in the mainstream media. It’s actually a good idea for the WordPress core team to keep things vague with the launch of the Gutenberg as it will give them enough time to fix everything to perfection.
  • 7. How the WordPress Gutenberg Editor Works Now that we’ve gotten the basic introductions out of the way, we can then proceed to tackle the intricacies of how the WordPress Gutenberg editor works. The developers wanted the Gutenberg to handle complex tasks while making it very user-friendly to you, so that website editing will feel like a breeze even for beginners. It’s actually a very interesting idea to discuss.
  • 8. Block-Based Editing 101 Basically, the Gutenberg differs from the current WordPress TinyMCE editor by replacing the single edit field with a lot of individual “blocks.” From what we’ve learned, these blocks will allow you to build more complex designs compared with the limitations from the previous website editor. The WordPress Gutenberg editor therefore is a huge step towards simplification in web design and general web editing.
  • 9.
  • 10. What is a Block? Whether in layman’s terms or in technical-specific, a block is a general term used for almost anything. A block could be used for: • Regular text • Images • Video embeds • Buttons • Widgets (yes, those same widgets you use in your sidebar) • Tables And just like the TinyMCE editor where you can download and install plugins the Gutenberg editor also has room for open source plugins that will be added as succeeding blocks on the dashboard. The WordPress plugins Gutenberg will give you more flexibility as you build your site onto a more comprehensive level. Each block is independent from the other blocks, therefore you can customize them separately and the other blocks or sections on your website won’t be affected.
  • 11. Can Gutenberg be Considered as a Page Builder? Unfortunately, Gutenberg in its current form cannot yet be considered as a page builder. Remember when we told you that it WILL become an all-in-one website editor? Well, upon its release it will be in its basic form and it will need to evolve further down the road as the core developers will encounter new ideas from time to time. I think that when it comes out any time soon this year even the WordPress Gutenberg tutorial will emphasize on it not being an immediate replacement for page builder apps.
  • 12.
  • 13. How to Install Gutenberg? First make sure that you have the WordPress version 4.8 before downloading and installing the Gutenberg website editor. You can find the WordPress plugins Gutenberg by doing a Google search – this should lead you directly to the WordPress repository – or you can download it from your WordPress dashboard under “Add New” plugins tab. Keep in mind to install this plugin on a test site to avoid any errors.
  • 14.
  • 15. Pros of WordPress Gutenberg Editor • Plays a role as a central hub where core developers, theme developers, plugins, and the website editor could integrate and work as one. • Learn it once and use it everywhere. • Publishers will likely favor it better than the TinyMCE and other website editors that have come before. • Gutenberg provides a less distracting experience with more screen space. • Blocks help you customize your site better and the new alignment options allow for full-width template sites to have their users view larger resolution screens. It’s also very responsive. • Works well on mobile devices. • Theme and plugin developers will have the ability to create their own custom blocks. • Designed for people who does not have any web design experience and beginners will find it very easy to use.
  • 16. Cons of WordPress Gutenberg Editor • Unable to support Markdown in its current form. • Although it has been designed to make it easier for beginners to learn, some may still have a hard time learning it. • Gutenberg website editor gained the ability to support meta boxes as of October 2017; however, it still needs further development. But as a bonus SEO Yoast is also fully supported. • The developers did not enable the editor to support responsive columns yet. This may prompt users to install shortcode/visual builder plugins to compensate. The core team definitely has to include this as soon as possible or they will get tons of complain for something that’s almost trivial. • Another issue with the Gutenberg is that there have been hundreds of thousands of themes and plugins that were created for the TinyMCE editor. Once the Gutenberg is released, then all those themes and plugins will most likely encounter backwards compatibility problems and the developers will have to update them in order to be
  • 18. WordPress Gutenberg version 2.3.0 You may want to start exploring the WordPress Gutenberg version 2.3.0 now and see what you can do with your test website. If everything goes well, then you can even publish your new site immediately! You will absolutely love it as it is easier to build and customize your website than with the previous TinyMCE editor. In 1- 2 years from now the WordPress Gutenberg website editor will be completely different and will be able to support so many other apps, themes and plugins and it will be far superior than all the other editors that have come before it!