Switching to the New WP Block Editor: Late Adaptor to Gutenberg 2.0

Advertisements

Welcome to Gutenberg

I’m not sure what the official name of the newest version of Gutenberg is or how WP ambassadors are distinguishing the two “block” editors. All I know is that I was one of those very reluctant, old school WP users who was using Classic up until today.

The initial version of the block editor had many glitches, it was bulky and cumbersome to use. It didn’t feel ready for prime time to me and it was time consuming for me, so I had a delay in switching over.

Advertisements

And I Really Liked Classic

I actually liked typing my posts out in one large paragraph with bits of code in it. It was fast, easy, no-fuss.

I didn’t mind having to switch between the two interfaces, the main and the admin dashboards.

I could accomplish what I wanted to accomplish. There were limitations of course and I didn’t really know the full extent of what the new editor could offer.

I didn’t know what the advantages of the new block editor were. It seemed to be a round-about way of doing something I was already used to doing and I could do it with less clicks, in less amount of time.

My First Post

On January 28, 2918, my first post, Road Trip to Beautiful Taos, New Mexico, was the first post I ever created. It took me a little while to get it down, to learn a bit of code, but I thoroughly enjoyed it, using Classic all the way long.

So far I have published 286 posts.

I hadn’t given the new editor a second thought though for a while.

A New Era in Website Building

However after an opportunity to participate in a bit of beta testing with the newest block editor recently, it appeared that most of my troubles with the first version had been fixed. So I decided to give it another try and have since switched over.

I have also changed themes, cleaned up a few posts.

It’s actually not half as bad as what I thought it would be now that the main bugs have been worked out. The discovery of some pretty neat features and shortcuts have also been a treasure.

It’s a learning curve for sure and has created a totally different workflow for me. A few minor buggy things and quirks still have to be worked out but they’re not a deal breaker for me any longer.

The two interfaces haven’t gone away but the tasks have been solidified in their assigned allottment, with admin view being the dominant, post builder, which is ok, I’m getting used to it.

Navigation is much more intuitive and user friendly this second time around. I’m getting faster at building these blocks.

Still Learning

I have a ways to go before I feel completely comfortable and up to speed compared to my usual process.

After perusing a few posts from the WP Reader where some members mentioned bailing on the platform, I was a little bummed to hear that because I really enjoy our WP community. It is unique to the website building world out there.

I hope you, like me, are able to revisit the latest version of the editor and find a little joy in this.

I just finished a cute book called Beach Read by Emily Henry, so when I saw the option to create a clickable button, Amazon embed, I thought, ok this is pretty awesome.

Overall Thoughts

It took me a couple of hours to convert my site content to the new theme I picked out, Twenty Twenty. About 2 hours to create this post, but it worked!

Take a moment to look around my new style of website, I hope you can appreciate the blocks I used for a more simplified, clean, modern look.

I like how my newly accommodating site uses the full width of the screen, expanded covers as seen on my Photography page, and perfect side-by-side posts like I built on my Recipes page.

There are quite a few options you can make and modifications within those options that allow a lot of visual creativity at first glance.

To know and understand code is an amazing skill and the possibility to use it is still there. The CSS modifier is still there. Both the Visual and HTML Code editors remain. I definitely don’t want to forget what I’ve learned.

I’m still testing it all out. Making tweaks here and there. Deciding if I even need to add any CSS.

I think the amazing thing is, is that I actually have no code in my CSS box at the moment. Below are the codes I embedded to better customize my site before I switched over from Classic. I was using the Rosalie theme at the time.

CSS


/*
Welcome to Custom CSS!
 
To learn how this works, see http://wp.me/PEmnE-Bt
*/
.site-content a:link {
                                    color: #53808a;
}
 
.site-content a:visited {
                                    color: #53808a;
}
 
.site-content a:active {
                                    color: #3364FF;
}
 
.site-content a:hover {
                                    color: #6D6A59;
}
/*Change color of certain text inside recipes #10600201-hc*/
 
div.jetpack-recipe-notes {
                                    color: black;
}
 
div.hrecipe.jetpack-recipe > h3 {
                                    color: black;
}
 
div.hrecipe.jetpack-recipe > ul {
                                    color: black;
}
 
/* hide header image everywhere except home page | 11968709-hc */
.page-id-4938 .image-header-flexible.container img {
                                    display: inherit !important
}
 
/* Hide the site logo / #12026071-HC JB */
 
.site-logo {
                                    display: none;
}
 
.image-header-flexible.container img {
                                    display: none;
}
/* Adjust the color of the diamond element throughout the main content font */
p {
  color: black;
}
 
.site-title a {
color: black !important;
border: none;
font-size: 25px !important;
font-family: Montserrat !important;
}
 
.site-description {
color: black !important;
border: none;
font-weight: lighter !important;
font-size: 25px !important;
font-family: Montserrat !important;
}
 
/* Adjust the color of the diamond element throughout the Rosalie theme | 10453438-hc */
.site-description:before, .entry-title:before {
  background-color: #53808a;
}
.site-description:after, .entry-title:after {
  border: 1px solid #53808a;
}
 
/*Hide all meta except date*/
.entry-meta .reading-time {
                                    display: none;
}
 
.single-post .entry-meta {
                                    display: none;
}
 
/* Change Slider Max Height to 500px */
.flexslider .slides>li {
                                    max-height: 500px;
}
 
.flexslider .slides > li .hentry.has-post-thumbnail h1 {
color: white !important;
font-size: 20px;
font-family: Arimo!important;
}
 
.flexslider .slides .entry-meta span.posted-on time {
color: white !important;
font-family: Arimo
!important;
font-size: 18px !important;
}
/* Reduce additional margin/padding space at the top of website — 20049005-hc */
.site {
                                    padding-top: unset !important;
}
.image-header {
                                    margin-top: unset;
}
/* remove gray background of menu | SKO #10440350-hc */
 
.navbar {
  background: #EDE7E3;
}
 
/* widget background white | SKO  #10440350-hc */
 
wf-active .widget-title {
    font-weight: 400;
    font-style: Arimo;
    background: black;
}
 
/*— removes opacity from the related posts / #10440350-HC-PK —*/
#jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}
 
.site-header {
                                    background-color: #cc0000;
}
 
.widget-title::after {
                                    border-color: #53808a transparent;
}
 
.widget-title {
                                    background-color: #53808a;
}
 
/* Adjust the font and box colors of the read more box */
.entry-summary a.more-link {
background: black !important;
color: white !important;
}
 
/* Adjust the color of the arrow element on the read more box */
.entry-summary a.more-link:after {
color: white !important;
font-size: 35px !important;
}
 
/* Adjust the font of the front page post’s dates */
span.posted-on time {
color: black !important;
font-size: 16px !important;
font-family: Arimo;
}
 
/* Change color of the font of the footer */
.site-footer a {
  color: #688D93;
}
 
footer#colophon {
background: black;
}
.site-info {
background-color: black;
}
 
/*Center Bottom Footer Links*/
/* Center text on 3rd footer widget area | 10542998-hc EH */
#footerthird {
    text-align: center;
}
/* Remove period from date of posting and centering date*/
.entry-meta span.posted-on {
    margin: 0 !important;
    position: relative;
    display: inline-block;
}
    .image-header-flexible {
        padding-left: 0;
        padding-right: 0;
        width: 100%;
}
.image-header-flexible {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}
 
.image-header-flexible.container img {
    min-width: 100%;
}
.entry-meta span.posted-on {
    margin: 0 !important;
    position: relative;
    display: inline-block;
}
.jetpack-social-navigation-genericons a[href*=”goodreads.”]:before {
    content: “\g”;
}
.jetpack-social-navigation-genericons a[href*=”redbubble.”]:before {
    content: “\RB”;
}
/* — enhanced widget title / 13537906-HC (MI) — */
 
.enhanced-text-widget h2.widget-title a {
                                    color:#000;
}

Let Me Know About Your Thoughts

Have you made the switch yet?

Advertisements

<span class="uppercase">Hello, I'm Erica </span>
Hello, I’m Erica

Recipe developer, book reviewer, and artist. Expect delicious recipes both traditional and new, book reviews of all sorts of genres, a variety of creative expression, life musings, and much more!

Advertisements

MOST RECENT


What are your thoughts? Join our conversation below!

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: