Blocks and Formatting

This Is a Post Title

This Is a Post Title

This is a sample post showing the styling of different types of content often used. Headlines, images, tables etc. Posts in WordPress can be used for news, journaling, research documentation etc. and can embed all sorts of media and different types of content. This is placeholder text and is not intended to be read. If ...

Template: Sticky

Template: Sticky

Sticky Posts are for post content you want to elevate and keep at the top of the list. As you add posts on your website, WordPress displays them in reverse chronological order with the most recent at the top of the list. “Sticky Posts” let you override that. This approach pushes older content down the ...

Video Styles

Video Styles

Inserting video into your website is easy if your video is already publicly hosted on YouTube or Vimeo. It can be full width or smaller if inserted into a column. To add a video to your page: While you are on the page you wish to edit, click on the little icon at the ...

This is a sample post

This is a sample post

This is an H2 headline the image above needs to get fixed. It should be centered. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Auctor eu augue ut lectus arcu bibendum. Neque sodales ut etiam sit amet nisl. Dui nunc mattis enim ut tellus ...

Hello world!

Hello world!

Welcome to WordPress. This is your first post. Edit or delete it, then start writing! ...

Block: Image

Block: Image

Images get placed on a page with the “IMAGE” block. You can choose alignment None, Left, Right, and Center. The next release of our theme will add support for align wide, and full width. TIP: Try to avoid having images flush right or left with text wrapping as this formatting doesn’t work well on mobile. You ...

Block: Button

Block: Button

There are 2 different button styles supported by our WordPress theme- Solid (default) and Outline. To add a button to your page: While you are on the page you wish to edit, either click on the little icon at the top left of your page or click the symbol after the block where ...

Image Styles

Image Styles

WordPress calls images that have text titles “cover blocks.” Here are some pre-made styles that let you add images with text overlay. This block-type has several alignment options, and you can also align or center the text inside the block. The background image can be fixed and you can change its opacity and add an ...

Block: Columns

Block: Columns

WordPress provides a lot of flexibility to set text in columns. You can set text from 1 to 8 columns but we don’t recommend exceeding 4 columns. Keep the mobile experience in mind. Those columns will stack vertically as the page width decreases for different devices and breakpoints. If you want to insert columns into ...

Block: Gallery

Block: Gallery

Gallery blocks have two settings: the number of columns, and whether or not images should be cropped. The default number of columns is three, and the maximum number of columns is eight. We don’t recommend using more than 4 columns. Two Column Gallery Reusable Block Name: Gallery__ Two Column Images with caption overlay Three Column ...

Block: Quote

Block: Quote

WordPress has styles for both “block quotes” and “pull quotes”. Pull quotes are used when you want to highlight or elevate certain text within a page. In general with pull quotes, the same text would appear twice- within the body content and then stylistically called out within a pull quote. Block quotes are used primarily ...

Block category: Common

Block category: Common

This page is for Susy and Scott to debug some of the styles… I think it should be removed after the type style issues are fixed. (Text settings LARGE is white, for example) and the NESTED LISTS is messed up…. it doesn’t maintain the right number sequence. The Common category includes the following blocks: Paragraph, ...

Social Embeds

Social Embeds

You can embed social media posts into your WordPress site. Embedding is really intuitive. Just select the Reusable Block for the social property you want to embed. WordPress will prompt you for a URL. Copy the URL that you want to embed, and paste it in when prompted. Twitter Reusable Block Name: Twitter Notes about ...

Block category: Widgets

Block category: Widgets

Widgets still need some work…. can you hold off on using them for now? The Archive Widget: The same Archive widget but as a dropdown: The Category widget block has an additional option for showing category hierarchies: The Latest Comments widget can display or hide the avatars, the date, and the comment excerpt: Here is ...

Block category: Formatting

Block category: Formatting

A few formatting categories WordPress offers are shown below. These are outside of inline styles like bold, italic etc. The classic block The custom HTML block The Preformatted Block The Road Not Taken Robert Frost Two roads diverged in a yellow wood, And sorry I could not travel both (_/) And be one traveler, long ...

Keyboard navigation

Keyboard navigation

There are many different ways to use the web besides a mouse and a pair of eyes. Users navigate for example with a keyboard only or with their voice. All the functionality, including menus, links and forms should work using a keyboard only. This is essential for all assistive technology to work properly. The only ...

Markup: Older versions of WordPress

Markup: Older versions of WordPress

Content imported from older versions of WordPress This page shows how Gutenberg is going to format content imported from older versions of WordPress. We’ve updated some of the styles to bring them into the new theme. Headings Header one Header two Header three Header four Header five Header six     Blockquotes Single line blockquote: ...

Markup: Text Alignment

Markup: Text Alignment

WordPress supports the following text alignments – flush left, centered, flush right, and justified. Please don’t justify your text. You can easily make your text unreadable as it tries to justify itself to the full line length. In general, “right align” is not used. “Center Align”, has it’s place and should be used minimally. Default ...

Markup: Title With Special Characters ~`!@#$%^&*()-_=+{}[]/\;:'”?,.>

Putting special characters in the title should have no adverse effect on the layout or functionality. Special characters in the post title have been known to cause issues with JavaScript when it is minified, especially in the admin when editing the post itself (ie. issues with metaboxes, media upload, etc.). Latin Character Tests This is ...

Markup: Title <em>With</em> <b>Mark<sup>up</sup></b>

Markup: Title With Markup

Verify that: The post title renders the word “with” in italics and the word “markup” in bold (and “up” is superscript). The post title markup should be removed from the browser window / tab. ...

Template: Featured Image (Vertical)

Template: Featured Image (Vertical)

This post would display a featured image, if the theme supported it. The UVM WordPress theme uses featured images on the News or Post overview page. The image is not duplicated on the individual page. Non-square images can provide some unique styling issues. This post tests a vertical featured image. ...

Template: Featured Image (Horizontal)

Template: Featured Image (Horizontal)

This post would display a featured image, if the theme supports it. With the UVM WordPress theme, we are using featured Images on the news overview page. They are not duplicated on the individual Post or News page Non-square images can provide some unique styling issues. This post tests a horizontal featured image. ...

Template: More Tag

Template: More Tag

This content is before the more tag. Right after this sentence should be a “continue reading” button of some sort on list pages of themes that show full content. It won’t show on single pages or on themes showing excerpts. ...

Template: Excerpt (Defined)

Template: Excerpt (Defined)

This is a user-defined post excerpt. It should be displayed in place of the post content in archive-index pages. ...

Template: Excerpt (Generated)

Template: Excerpt (Generated)

This is the post content. It should be displayed in place of the auto-generated excerpt in single-page views. Archive-index pages should display an auto-generated excerpt of this content. Depending on Theme-defined filters, the length of the auto-generated excerpt will vary from Theme-to-Theme. The default length for auto-generated excerpts is 55 words, so to test the ...

Template: Comments

Template: Comments

This post tests comments in the following ways. Threaded comments up to 10 levels deep Paginated comments (set Settings > Discussion > Break comments into pages to 5 top level comments per page) Comment markup / formatting Comment images Comment videos Author comments Gravatars and default fallbacks ...

Template: Comments Disabled

Template: Comments Disabled

This post has its comments, pingbacks, and trackbacks disabled. There should be no comment reply form, but should display pingbacks and trackbacks. ...

Template: Pingbacks And Trackbacks

Template: Pingbacks And Trackbacks

This post has many pingpacks and trackbacks. There are a few ways to list them. Above the comments Below the comments Included within the normal flow of comments ...

Media: Twitter Embeds

Media: Twitter Embeds

Really cool to read through and find so much awesomeness added to WordPress 3.6 while I was gone. I should take three weeks off more often. — Andrew Nacin (@nacin) April 3, 2013 This post tests WordPress’ Twitter Embeds feature. Note: It doesn’t look like too much has changed with this between Classic WordPress and ...

Post Format: Standard

Post Format: Standard

All children, except one, grow up. They soon know that they will grow up, and the way Wendy knew was this. One day when she was two years old she was playing in a garden, and she plucked another flower and ran with it to her mother. I suppose she must have looked rather delightful, ...

Post Format: Gallery (Tiled)

Post Format: Gallery (Tiled)

This is a test for Jetpack’s Tiled Gallery. Install Jetpack to test. This is some text after the Tiled Gallery just to make sure that everything spaces nicely. ...

Post Format: Image (Caption)

Post Format: Image (Caption)

Students enjoying the Dairy Bar at UVM.   ...

Post Format: Audio

Post Format: Audio

Link: St. Louis Blues Audio shortcode: ...

Post Format: Video (YouTube)

Post Format: Video (YouTube)

WordPress can embed both YouTube and Vimeo videos that are public and “unlisted”. A search for “video” in the Blocks area yields a lot of options. Admittedly, it’s confusing to have so many options to embed a video on your WordPress page. I would ignore the “Common Blocks”. Here is some guidance for the other ...

Post Format: Aside

Post Format: Aside

This is the “Aside” Post format. WordPress defines “Aside” as a brief snippet of text that isn’t substantial enough to feel like a complete blog post. Someone on the WordPress forum says that “Asides  (1) do have URLs, (2) you can assign Categories to them, and (3) they do appear in your RSS feed. :)” ...

Post Format: Status

Post Format: Status

WordPress, how do I love thee? Let me count the ways (in 140 characters or less). ...

Post Format: Link

Post Format: Link

The WordPress Theme Review Team Website ...

Post Format: Quote

Post Format: Quote

This is what a blockquote looks like when it comes over from Classic into Gutenberg. If you tell the truth, you don’t have to remember anything. Mark Twain ...

Post Format: Chat

Post Format: Chat

This is what “Chat” text looks like when it comes over from WordPress Classic to Gutenberg WordPress. Abbott: Strange as it may seem, they give ball players nowadays very peculiar names. Costello: Funny names? Abbott: Nicknames, nicknames. Now, on the St. Louis team we have Who’s on first, What’s on second, I Don’t Know is ...

Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu

Title should not overflow the content area A few things to check for: Non-breaking text in the title, content, and comments should have no adverse effects on layout or functionality. Check the browser window / tab title. If you are a plugin or widget developer, check that this text does not break anything. The following ...

This post has no title, but it still must link to the single post view somehow. This is typically done by placing the permalink on the post date. ...

Edge Case: Many Tags

Edge Case: Many Tags

This post has many tags. ...

Edge Case: Nested And Mixed Lists

Edge Case: Nested And Mixed Lists

I am seeing Nested Lists are not working and need to be addressed. Nested and mixed lists are an interesting beast. It’s a corner case to make sure that Lists within lists do not break the ordered list numbering order Your list styles go deep enough. Ordered – Unordered – Ordered ordered item ordered item ...