#how to convert gif to html conversion

[izicodes]

Convert HTML to Image: A Step-by-Step Guide ✨

Do you want to turn some HTML code you've made that's on your website and have a way to convert it into an image for you to save?

Well, look no further! I too wanted to do the same thing but funny enough, there weren't any straightforward tutorials out there that could show you how! After hours of searching, I finally discovered the solution~!

This is an old tutorial I made 🐼

💛 Set your environment

Before we dive into the conversion process, I'll assume you already have your HTML code ready. What you want to learn is how to turn it into an image file. You should have a good grasp of HTML and JavaScript. For this tutorial, we'll use the following HTML code example:

We won't include the CSS code, as it doesn't affect this tutorial. The JavaScript file (script.js) at the bottom of the body element is where we'll add the functionality for the conversion.

Your page should resemble the following:

As you can see, the "Click me" button will handle the conversion. We aim to convert everything within the div.info-div into an image.

💛 Using the html2canvas JavaScript Library

The html2canvas library allows you to take screenshots of webpages and target specific elements on a screen. Here are the steps to include the library in your project:

The steps to put the library in your project:

Visit the html2canvas website for more information.

Copy the CDN link from here

and include it in a script tag in your project's head tag in the HTML file:

That's it for including the library on the HTML side. Now, let's move on to the JavaScript code.

💛 JavaScript Functionality

Here's the JavaScript code to handle the conversion:

In this code, I want to turn the whole div.info-div into an image, I put it into a variable in const div = document.querySelector(".info-div");.

I also put the button into a variable in const button = document.querySelector("button");

I added a click event listener to the button so when the user clicks the button, it will follow the code inside of the event listener!

You can find similar code like this in the documentation of the html2canvas library:

What is happening here is:

We add the div (or what the element we want to take an image of) into the html2canvas([element]).then((canvas)

Added the image file type url to a variable = const imageDataURL = canvas.toDataURL("image/png"); - You can replace the png to other image file types such as jpg, jpeg etc

Created an anchor/link tag, added the href attribute to imageDataURL

The download attribute is where we will give the default name to the image file, I added "dog.png"

Perform the click() function to the anchor tag so it starts to download the image we created

And that's it!

💛 The End

And that's it! You've successfully learned how to turn your HTML into an image. It's a great way to save and share your web content in a unique format.

If you have any questions or need further clarification, please comfortable to ask. Enjoy converting your HTML into images! 💖🐼

[currentfox452]

Swf To Screensaver Converter Online

Html To Swf Converter Online

Free Online Swf File Converter

Online Swf Converter

Swf To Screensaver Converter Online Converter

Swf To Screensaver Converter online, free

The Conversion Service is a free online service for convertion from SWF to EXE. It allows you to upload and convert any flash SWF file to standalone flash projector, and download it immediately! The standalone flash projector has the Flash Player embedded in the EXE file! Finalhit is an independent software development company founded in 2001 in London, United Kingdom. Finalhit provides high quality software solutions, reliable and easy-to-use, without compromising on innovation and cutting-edge technology. SWF is an Adobe Flash file format used for multimedia, vector graphics and ActionScript. Originating with FutureWave Software, then transferred to Macromedia, and then coming under the control of Adobe, SWF files can contain animations or applets of varying degrees of interactivity and function.

13 July 2020 Technology Manager of Test Dept.

Summary

SWF can be distributed and read by common WEB browsers, but less supported by the Windows system. What’s worse, it cannot be directly opended in the computer. The quick solution is to convert SWF to MP4, one of the most popular video container formats.

Content

SWF (Small Web Format) is a file format created by Adobe Flash, and its file extension is “.swf”. It contains texts, vector graphics, and the interactive contents written with ActionScript. People compress the SWF data in order to share the file easily. Therefore, it is a mini web format. As an outdated Flash file, SWF has been phased out. Some devices, such as Windows, Mac, iPhone and Android devices even don’t support users to directly open the SWF files. But it can be played in Flash Player or in the web browser with the Flash plugin installed.

If you want the SWF file to be used in more devices, we suggest you convert SWF to MP4, the widely used format supported by most of devices.

Renee Video Editor Pro has the powerful functions in video editing, including video format conversion. It supports to freely convert between video formats, such as SWF to MP4.

Renee Video Editor Pro – Multi-function Video Editing Software

Screen RecordingRecord screen and webcam in Windows computer.

Cut Videos & AudiosUsers are free to cut videos and auidos clips with setting start and end time.

Multiple Edit ToolsMerge, crop, rotate, cut and transform video easily. Change and add background music, subtitles and remove watermark from video.

Format ConversionSupport to convert videos and audios into different formats.

Screen Recording Record screen and webcam in Windows computer.

Multiple Edit ToolsCut Videos & Audios Users are free to cut videos and auidos clips with setting start and end time.

Multiple Edit ToolsMerge, crop, rotate, cut and transform video easily. Change and add background music, subtitles and remove watermark from video.

Format ConversionSupport to convert videos and audios into different formats.

Free TrialFree TrialFree Trial

3000 users have downloaded and edited videos with fun!

File converter/Video/Convert to SWF/MP4 converter/ SWF to MP4

or drag and drop file

You can convert SWF file to MP4 as well as to variety of other formats with free online converter.

How to convert swf to mp4?

Step 1

Html To Swf Converter Online

Upload swf-file

Select swf file, which you want to convert, from your computer, Google Drive, Dropbox or drag and drop it on the page.

Step 2

Convert swf to mp4

Select mp4 or any other format, which you want to convert.

Step 3

Download your mp4-file

Wait till your conversion process will be completed and click download converted mp4 file.

Online and free swf to mp4 converter

Fast and easy

Just drop your swf files on the page to convert mp4 or you can convert it to more than 250 different file formats without registration, giving an email or watermark.

Free Online Swf File Converter

Don't worry about security

We delete uploaded swf files instantly and converted mp4 files after 24 hours. All files transfer with secured an advanced level of SSL encryption.

All in the cloud

You don't need to install any software. All swf to mp4 conversions make in the cloud and don't use any resources of your computer.

Shockwave Flash Movie

File extension.swfFile categoryvideoDescriptionThe Swiff owned by Adobe is used for the animated vector representation. It can contain the texts as well as other vector oriented graphics. Any web browser with Flash plug-in installed can play the file.Technical detailsIt was first just an acronym of “Shockwave Flash” because it was only developed for Shockwave player. These files are binary and are stored in the form of 8-bit bytes. The latest SWF10 version allows the expansion of text capabilities with support for bidirectional texts and complicated scripts. This allows embedding JPEG oriented images, which operates at an alpha channel for opacity and smooth filter.ProgramsMain programAdobe Flash PlayerDeveloperFutureWave SoftwareMIME type

application/x-shockwave-flash

Online Swf Converter

MPEG-4 Video File

File extension.mp4File categoryvideoDescriptionThe MP4 files (MPEG-4 part 14 files) are the multimedia files used with multiple stations and video players simultaneously. They can store digital audio streams and digital video, and other suitable amounts of data like subtitle tracks. MP4 video format is a widespread file format due to its very own container format. It is also used with multiple platforms such as iTunes, PlayStation, and portable PSP. It is also a popular file format for streaming over the Internet. For instance, YouTube videos have MP4 extension.Technical detailsThe technical details of MP4 files differ in significant aspects and are unique as well, first released in 2001 under ISO/IEX 14496-1:2001 standards. It uses an AAC encoding to wear off unauthorized users from copying the data. The main purpose is streaming rather than sending video or audio information. MP4 files can be used to store audio streams and text information, subtitles, and still images. At the same time, MPEG format can’t do this. Anyhow the processing of data into MPEG-4 part 14 requires private streams such as the use of hint tracks to include the information.Programs

VLC media player

Eltima Elmedia Player

Apple QuickTime Player

DeveloperMoving Picture Experts GroupMIME type

audio/mp4

FAQ

Firstly, select a swf file you want to convert or drag and drop it. Secondly, select mp4 or any other format you want to convert your file to. Then click convert and wait until your file is converted

Video conversion usually takes a few seconds. You will convert swf to mp4 very quickly.

🛡️ Is it secure to convert swf to mp4 on OnlineConvertFree?

Sure! We delete your uploaded and converted files, so nobody has access to your information. All types of conversion on OnlineConvertFree (including swf to mp4) is 100% safe.

📱 Can I convert swf to mp4 without software installation?

Swf To Screensaver Converter Online Converter

Absolutely! OnlineConvertFree doesn’t require installation. You can convert any files (including swf to mp4) online on your computer or mobile.

Swf To Screensaver Converter online, free

swf converter

[loadguild600]

Madcap Flare 8 Keygen Generator

Biopython. MadCap Flare is a useful and one of the most versatile help authoring tool on the market.

Madcap Flare 8 Keygen Generator 2020

Madcap Flare 8 Keygen Generator Free

Madcap Flare 8 Keygen Generator Download

Madcap Flare 8 Keygen Generator

MadCap Flare enables you to import all of your legacy content. Import Microsoft Word documents, HTML documents, RoboHelp projects, and even HTML Help projects. MadCap Flare will convert them all to XML format, including direct HTML to XHTML conversion.

Many downloads like Madcap Flare 9 may also include a crack, serial number, unlock code, cd key or keygen (key generator). If this is the case. MadCap Flare 15.0.7081.30245 + crack/keygen. 2 torrent Madcap flare free. Universal Keygen Generator license key you can generate a serial key for any software any version. It is a right choice for beginners and experienced users. Barcode Fonts - Ean 8 Deluxe. DOORS Link Floating Licence Edition. Madcap Flare Training. Madcap Flare 8 Keygen Generator Average ratng: 3,5/5 343 reviews MadCap Software has published a whitepaper called. Download Aplikasi Membuat Desain Kaos Bola. Eventually those jobs could be at risk, because autonomous technology now being developed aims at on-highway drivers. That load of in Colorado last year garnered much publicity. Flareget download manager serial key Flareget download manager 4.4.100. Abelssoft checkdrive plus 2016 keygen crack free download. In addition to the groundbreaking new visual editor, MadCap Flare Keygen is packed with features to make your job easier. Customize your authoring. New CNH EST 8.4 Keymaker for activatorUS $350.00. Madcap Flare 8 Keygen Generator Behind some of those perforations are LEDs, used to make this into a display. By default, a series of bars representing the various measurements are shown with the overall score in the top right-hand corner.

In addition to the groundbreaking new visual editor, MadCap Flare is packed with features to make your job easier. Customize your authoring environment. Open multiple documents simultaneously for easy cross-editing. Drupal development company. Design browse sequences visually with a simple drag-and-drop. Use the command line to compile your output. Take advantage of auto-numbering. Even use MadCap Flare's patent-pending new interface designs to access the underlying XML structure of your documents in a comfortable WYSIWYG environment.

Madcap Flare 8 Keygen Generator 2020

Don't know what a hover map is? Check one out in action! https://jsfiddle.net/MikeKelley/Lesu3m0o/embedded/result/#Result Image maps haven't really been updated since their inception in HTML 3.1, 20 years ago. I got tired and frustrated with the awful user experience and decided to improve it. I demonstrated hover maps in my MadWorld '16 session and my recent MadCap webinar. Many attendees asked if I could make my tool available, and I've finally been able to! Here's the hover map generator tool:

http://mike.kelley.consulting/tools/hovermapgenerator

Madcap Flare 8 Keygen Generator Free

And here's a blog post I wrote on how to implement them into Flare projects. I've additionally supplied a small, downloadable project you can use to get started:

Madcap Flare 8 Keygen Generator Download

http://mike.kelley.consulting/blog/how- .. s-in-flare

Madcap Flare 8 Keygen Generator

Happy hover mapping!

[thecrimsonfly]

WARNING: WALL OF TEXT! TL:DR: We're going on hiatus, so I can get the comic on its own hosting, and covert the comics to HTML5/javascript to make them easier to read on mobile and avoid the 2020 Flash-drop deadline.

So, if you've been visiting the Crimson Fly for the last few days, you'll notice that instead of the comics, there are just white rectangles where the comics used to be. That's because, in Dropbox (who I used to render content)'s words:

"Effective September 1, 2017, Dropbox Plus and Business users can no longer render HTML content, and the Public folder and its sharing functionality have been disabled."

What this means is that the blog can no longer access the strips from Dropbox to render on the site, so the "white rectangles" are the site's way of throwing its hands up, trying to show something it can't acccess.  The thing is, using dropbox to broadcast flash content on a blogger site was a "series of bandaids" on top of two on-going problems that I've always had since the comic's inception, that I was always going to have to address at some point. One is easily fixable now, the other is not.

The first problem is that the "site" isn't actually a site, but rather a blogger page retrofitted to look like a blog. This was done because, when I started the comic, I didn't have a source of income to pay for domain names hosting fees, and so I had to take what I could get. Tumblr couldn't host the swf files, and blogger was the most reliable "free" alternative I had at the time, using Dropbox to publish the content, since I couldn't directly upload the swf files to blogger. Buying a host would allow me to upload the strips (and flash player) directly to the site, and this would not be a problem.

This has been fixable for a while; remember when I switched from "thecrimsonflycomics.blogspot.com" to 'just' "thecrimsonfly.com." Well, that's because I started pony-ing up the money for a domain name.  Ever since I got my day job in 2014 (ish?) I've had a steady source of income that's allowed me to tackle a variety of small upscaling projects; a new workstation with two new computers for the comics, a webcamera and microphone for video recording and streaming, and the actual funds for tabling at comics conventions and printing comics to SELL at those conventions.  The only reason I didn't make the jump into hosting is that I didn't want the responsibility of maintaining upkeep on the site. I'm not a programmer or webdeveloper by trade, and I wouldn't know how to either set anything up or fix anything if it broke (hence why its not business-as-usual right now).

The second problem is really the coalescence of several small problems; my mediocre "skills" as a programmer, the increasing obsolescence of Adobe Flash and the SWF format, and the obscurity and lack of infostructure to support anything resembling animated interactive comics (due to said medium obscurity). What all that means is that beyond BARELY being able to make my comic strip, the internet doesn't know how to support and/or publish it, and it doesn't help that the file format chosen to make it is prone to hacks and better off dead in a ditch. And while I've been trying as many courses that can hold my attention span since Adobe decided to try out HTML5 in their little rebranding project called (bleh) "Animate," I don't know enough to convert the comic to a file format that will endure for the next 5-25 years. So, basically, a "crash" like this was always inevitable, whether now (thanks, dropbox) or in the next 3 years, thanks to Adobe promising to drop support for the swf format the comic exists in the next 3 years.

You can see the extensions of this problem if you're visiting the site for the first time; when the comic asks you to "activate Flash player" so you can even SEE the comic, or on mobile, where the comic isn't visible at all (Thanks, Steve Jobs). I'd kinda ignored these problems because I didn't know how to fix them, or even make an attempt at fixing them and I figured I'd have enough time to either learn the skills myself, or get someone else to fix them for me (even though I turned my nose up at getting actual help, since I'm trying to never be so cheap as to NOT pay someone, even if only in a consulting role). Well, the clock hasn't completely run out (I could get hosting and host the comics until 2020, at which point this problem would resurface), but I might as well start ripping off those bandaids and work on actual fixes.

So, to that end, rather than burn the candle at both ends, the comic is going to go on the dreaded hiatus until these goals can be met:

-The comic is stably viewable on computers using HTML5 -the comic is stably viewable ON and formatted FOR mobile using HTML5 -All current 104 strips are converted to a mobile/user friendly User interface -All current 104 comics are translated in their entirety (or updated to reflect the most current user interface) with no compromises in format or integrity.

What this means is: -No new comic updates -No new Youtube Comic video updates

Why not just give up on the animated portions until the situation is resolved?  Because the construction speed ratio of static, non-moving comics to the time it takes to animate one panel of the interactive strips is so horribly skewed that if I started doing static strips and waited for the fix to work on animated comics, I'd never catch up. The Crimson Fly would be effectively DEAD as an animated comic.

Why not just give up on the static portions and make it a series of animated shorts on YouTube? Those things take forever to make (3-5 months per short), and there'd be no content in the meantime, at which point, people's attention spans would wain and I'd lose all but the most loyal of fans. Sure I could make weekly 15 second strip-videos, but Youtube's algorithms are such that they wouldn't be very profitable, due to the minimalistic watch-time. I'd have to redirect fans to other forms of support that currently don't exist atm.

And both of those solutions (including the others that I'm not elaborating on) ignore the crux of the problem; the Crimson Fly is an Animated Comic in full, equal measure. Its not just the character or the story, its the format in which you guys enjoy it as well. Its something different for anyone looking for something different on the web, and until animated comics become so ubiquitous as to be the default medium for comics on the internet (not likely, but I can dream), the Crimson Fly will continue to be the premiere animated comic on the web. To go halfsies on either the animation or static illustration kills the interactivity, and that's just not acceptable.

And honestly, I need the break to be able to focus on fixing the problem, rather than bouncing between testing out code/fixes and making a diminished comic (and all the other stuff I have to do on top of that). Focusing on one thing at a time and all that.

I honestly don't know when I'll be back; I don't know how long it'll take to learn what I need to learn to fix/update everything, to say nothing of how long it'll take to actually fix/update everything and/or even compile them into complete stories and/or volumes (something I never fully figured out, even in actionscript). I can guarantee though, that I'll be out for rest of the year, and the Crimson Fly won't return until 2018, at the very least.  When in 2018? I have no idea. Ideally? January? Realistically? June at the earliest. Cynically speaking? This time next year, at the earliest.

But here's the thing: THE CRIMSON FLY WILL RETURN.

I've worked too hard, I've got too much planned, and there is too much faith in me to NOT come back to this adorable Spider-Sonic ripoff. So I will be back with a website, an easily viewable and readable animated comic, some PDFs for peeps who don't like their comics moving, some videos for peeps who don't like to flip pages, (maybe) an app, and (maybe) some merch. But I will be back.

And I'm not disappearing entirely! I'll still be on Twitch; working on other projects like animated shorts, the Eleven second club challenge and/or other projects.

This has just been a long time coming, and I figure that its better to deal with the consequences now, learn some new skills and maybe come up with some cool toys for everyone to play with, than have this conversation in 3 years time.

So, for those of you who've gotten to the bottom of this page, Those of you who're just now picking up the Crimson Fly for the first time from elsewhere, and those of you who've been around from the beginning: Thank you. This project can't just be for me, and your faith in me keeps me going every single day. It will be rewarded with an even better Crimson Fly; just you wait. Until then, I'll catch you peeps LATER!

-Collin "SkipperWing!" Byrd PS: if you can/would like to offer some tech support, my email is skipperwing@gmail.com. Thanks!

[restatebrk24219]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[restateagnt17101]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[seo53703]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[repmrkting17042]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[vidmktg30245]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[seocompany35203]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[ramonlindsay050]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[piatty29033]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[constructionsworkr3053]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[bathrem22032]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[duiatty48170]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL

[inetmrktng75247]

Gutenberg 101: What You Need to Know About the Update

Gutenberg 101: What You Need to Know About the Update

Ahh fall. Seasonal drinks, regrettable and ironic costuming decisions, a full version update to WordPress. Swaddled in the autumnal bliss of hearing your friends and relatives complain about the sheer audacity of the sun’s absence; so suddenly disabused from memories of nearly roasting alive hardly three weeks earlier… you may find yourself thinking… “What the eff is this Gutenberg thing that the shut-in developer at work keeps mumbling about?”

Send your anxieties to a lavish winter resort friend for I, that mumbling, shut-in developer, am here to provide a brief overview of what you can expect from the upcoming release of WordPress 5.0 and its new content editor riding gleefully in the passenger seat.

About Gutenberg editor

Gutenberg is the code name for the redesigned content editor in WordPress. This new editor will become the standard in WordPress 5.0 which is expected to show up November of 2018. This editor will replace that big ole text box with something more akin to a canvas to which you will add pieces or blocks of content.

If you’ve published work on Medium this new interface should feel just like home. For those familiar with editing content in WordPress this should be a welcome, but very different experience.

Our review of Gutenberg’s capabilities

The Portent development team has kept a watchful eye on Gutenberg and tested the development plugin in a few different scenarios to see the effects. Aside from a few small bumps in the road the addition of Gutenberg to various client sites (so far) has been a non-issue. Especially true for standard post content. The WordPress Community has always focused on backward compatibility for new features and Gutenberg appears to be adhering to that principle. If you would like to give the new editor a try, the plugin is available to install for free from the WordPress plugins repository.

Getting started

Before you run off and start furiously downloading I want to stress something semi-obvious: every site is unique. Even though we’ve found Gutenberg to be more-or-less harmless thus far I advise caution when adding a plugin that presents such a significant change. I also cannot speak for themes or sites that rely heavily on visual page building plugins such as Visual Composer, Divi, or Elementor. In these cases I would recommend having a developer do a diagnostic on a staging server or local machine to see how Gutenberg affects your particular site.

Handling existing content

The requisite doomsaying of the previous statement is a big reason that I wanted to write this post. Not everyone has a staging site to play with or the technical ability to spin up a local development environment for testing.

I have brought up Gutenberg in conversations at work numerous time over the last year (I’m pretty popular at the lunch tables), but perhaps you work in a “normal” office and have had only heard about this in passing with no real sense of what’s heading your way.

My goal here is to show some of the bigger changes that affect content workflow so that when you sit down with Gutenberg for the first time, you have an idea of what to do.

Now, this begs the question “What happens to my existing content?”

Format preservation

Once Gutenberg is present, content for existing posts will be placed in a block called ‘Classic’. The classic block will preserve your formatting, HTML markup, and shortcodes. You won’t need to rush out and frantically update all of your content into the new block format.

Shortcodes are still available, they are just a block now

Working within shortcodes

Neither HTML markup or shortcodes are going away with Gutenberg. Both still have their place in content creation. Both HTML and Shortcode blocks come standard in Gutenberg. Current shortcodes will still work and will continue to display as you move into block based layouts.

When the need to tinker arises you still have the option to edit as HTML

”Convert to blocks” feature

That you’ll build all your new articles and pages in Gutenberg from 5.0 on is a given, so this won’t be part of your standard workflow. But what of your legacy content?

I mentioned earlier that all existing content will be placed in a ‘Classic’ container allowing you to come back and update your posts to block layouts should you choose. There’s also a helpful extra option in Gutenberg that can provide you with a head start when converting your posts.

The ‘Convert to blocks’ option for the classic block will attempt to separate your content based on semantic HTML used in your copy. If text is wrapped in a blockquote it will be converted to a quote block, UL: unordered list or OL: Ordered list to a list block, or a header tag like H2 to a header block.

Using the convert to blocks option can give you a head start when converting older content

Adapting to Gutenberg

That’s enough about old content, let’s talk about new features that will affect your workflow.

The current standard for WordPress writers is to build their content in one large document. Paragraphs, headers, lists and other textual HTML items are manually entered. By contrast, in the new block-based editor content will be formed out of individual pieces. Pieces that can be moved freely, duplicated and adjusted in the editor.

Build your content the way chinchilla’s see the human body… in pieces

”Add Block” feature

Unlike HTML and Shortcodes, blocks are active elements. When a block is selected contextual options will become available on the right-hand side of the editor.

For instance, before Gutenberg if you needed to change the color for a portion of text you would do so in raw HTML. When working with shortcodes you add attributes in the text. Neither option would update within the editor. Anyone that has spent time working like this in WordPress knows the save-preview-edit shuffle.

Manipulate your co-workers with options… instead of emotions

”Transform to” feature

A feature available to WordPress developers which extends Gutenberg functionality is the ability tell a block what it can be transformed into.

A real-world scenario would be: you are writing an article and you add a paragraph block which later needs to become a blockquote. That paragraph block now has the ability to be transformed into a blockquote block. The important part here is: transformations allow you to quickly fix mistakes or change whole sections to another style without having to think too long about the least painful or most elegant way to do it.

Pro-Tip: This will be especially handy when using the ‘Convert to blocks’ option mentioned above.

Not ready for Gutenberg?

In preparation for the release and inevitable misgivings, the WordPress community has placed a plugin named Classic Editor on the plugin repository. The Classic Editor plugin will preserve the experience you have known and loved… at least since the last time it was updated. If you’re not quite ready to move ahead with Gutenberg but still need to update to WordPress 5.0 this plugin is the best option.

Just as not everyone was ready to stop triple tapping their flip phone keypad, not everyone will welcome a new experience and toolset in WordPress. That said, we hope you’ll be more excited and prepared for the coming changes after reading this.

As always, let us know in the comments if you have questions or anything to add from direct experience with the upgrade.

The post Gutenberg 101: What You Need to Know About the Update appeared first on Portent.

https://ift.tt/2QW5ISL