ustwo: An Open Source Example of a React-Powered WordPress Site

If you’re looking for a real-world example of the WordPress REST API with code that you can dig into, the new ustwo.com website is open source on GitHub. ustwo is a digital product agency most well known for their work on the award-winning Monument Valley app. They partnered with Human Made, a WordPress development agency, to build the backend of the site.

The ustwo.com frontend is a React.js single-page application that serves WordPress content via the WP REST API using custom endpoints. In a post called “Open Sourcing Our Website,” ustwo developer Daniel Demmel explains why the company put the site’s frontend up on GitHub.

“Ultimately, we’ve built something that feels novel and polished enough to share publicly,” he said. “We want it to be of real use to others – after all, it’s all very well reading on a blog about how nice it is using React or Docker, with some Hello World examples, but having a chance to look under the bonnet of a production website is an entirely different thing.”

The team at ustwo decided to get innovative with a “headless WordPress” setup earlier this year, before the WP REST API was officially merged.

“The way we used WordPress as a headless setup accessible only through the API for a high profile production website was a bit of a technological bet – with WP-API landing in WordPress core six months after we decided to go for it – so sharing our experience and codebase should give execution ideas and confidence to anyone else considering this setup,” Demmel said.

Advantages of Headless WordPress

If you’re wondering why an agency might go to all the trouble of creating their website as a single-page application, you need only check out ustwo.com to see the difference. The beautiful transitions and speediness of the UI put the site head and shoulders above similar portfolio sites.

“We chose to build the site as a single-page application in order to have full control over all of its aspects – including transitions between pages – and to make navigation super fast by not having to reload the browser,” Demmel said. “We chose React.js as a main JavaScript technology to do this, since it has built-in support to render pages on the server side too (called isomorphic rendering).

“Our content management system behind this is a WordPress instance which doesn’t actually render the pages itself, but instead serves content up via the API through a mixture of standard and customised JSON REST endpoints, making the vast majority of the content editable,” he said.

Coincidentally, WordPress.com’s Calypso project runs on a similar stack. “So if you like what they’ve done to make the editor experience awesome, you’ll like what we’ve done to make the visitor experience great,” Demmel said.

ustwo opted to make their work open source just like Automattic did with Calypso, recognizing the importance of sharing in helping the whole ecosystem move forward.

“For us, there’s so much more value to be gained from building on each other’s work and knowledge than trying to hold on to a short-term technological advantage,” Demmel said.

The REST API is Changing How Teams Work Together

In a case study published on Human Made’s website, the team reviewed how working on the ustwo.com project has changed the way they work.

Working with the WordPress REST API brought a separation of concerns that meant approaching project management in a new way. Our developers were focused solely on WordPress as a data entry and delivery application. We were just one part of a wider team that included a designer, a front end React developer, a front end CSS developer, a Node.js developer, a project manager, and the stakeholder. This allowed each part of the team to be completely focused on their component, working independently while feeding back to the rest of the team.

Human Made attributes this tidy separation of concerns to the new workflow that naturally comes out of using a REST API. Back and frontend developers are no longer stepping on each other’s toes:

The technology itself facilitated this change in project management: all that the front end developers need to make the site live is to change the URL where the data is. When developers are working locally in their development environments they can work with the content from the live site; it also streamlines the process of moving from staging to production. We found that the API hasn’t just changed WordPress but changed how people work together, creating a new workflow and pushing where WordPress is going.

For more details on the ustwo.com architecture, check out Human Made’s case study as well as ustwo’s post reviewing the process. Solid open source examples like this one are always helpful when learning to build with new technologies. All the code for the website is GPL-licensed and available on GitHub for anyone to use or repurpose.

How to Post Curated Content Across Multiple Social Platforms

Do you manage several social media accounts? Are you having trouble keeping them all active with fresh content? Content curation plays a key role in keeping your social profiles and pages active, and your audience satisfied. In this post I’ll show you how to quickly and efficiently post curated content across all of your social […]

This post How to Post Curated Content Across Multiple Social Platforms first appeared on Social Media Examiner.
Social Media Examiner - Your Guide to the Social Media Jungle

8 Twitter Tips to Improve Your Twitter Marketing

Is your Twitter marketing working? Do you want more engagement for your tweets? Knowing how to write your tweets and when to publish them can increase visibility, boost engagement and drive traffic to your site. In this article you’ll discover eight tips to deliver better tweets. #1: Tweet Without Links Research shows that tweets without […]

This post 8 Twitter Tips to Improve Your Twitter Marketing first appeared on Social Media Examiner.
Social Media Examiner - Your Guide to the Social Media Jungle

Tickets on Sale for WordCamp Europe 2016

Nearly seven months before the event takes place, tickets for WordCamp Europe 2016 in Vienna, Austria on June 24-26 are on sale. There are two types of tickets available, General admission and Microsponsor.

General admission tickets are € 40.00 each and cover both days to the event, access to all sessions, lunch, coffee breaks, warm up events, and the after party. It also includes a WCEU 2016 t-shirt, stickers and other swag.

Microsponsor tickets are € 150.00 and includes everything the general admission ticket offers. The major difference between the two besides cost, is that the microsponsor ticket is a great way to support the European WordPress community. Microsponsorships shows appreciation of the event and grants you a special mention on the sponsorship page.

Before you purchase tickets, it’s important to note that due to Paypal’s 60 day refund policy, the event is not issuing refunds. If you buy a ticket and want to give it away as a gift, or sell it to someone, you’ll need to edit the details using the link in your ticket purchase confirmation email.

Although the schedule is not yet posted, WordCamp Europe has an established history of being one of the best WordPress events of the year. Let us know if you plan on attending.

9 Instagram Tips and Tools for Marketers

Are you using Instagram for your business? Want to get more from your marketing efforts? Improving your Instagram content and boosting engagement can be as simple as adding a few tactics and tools to your marketing routine. In this article you’ll discover nine tips and tools to improve your Instagram marketing. #1: Tailor Images to […]

This post 9 Instagram Tips and Tools for Marketers first appeared on Social Media Examiner.
Social Media Examiner - Your Guide to the Social Media Jungle

How to Use Social Media Insights to Improve Your Marketing

Are you marketing on Twitter, Facebook or Pinterest? Do you know which type of posts your followers prefer? Social media analytics let you see who your followers are and what they like. In this article you’ll discover how to use your audience insights from Twitter, Facebook and Pinterest to improve your social media marketing. #1: Track Follower Preferences on Twitter […]

This post How to Use Social Media Insights to Improve Your Marketing first appeared on Social Media Examiner.
Social Media Examiner - Your Guide to the Social Media Jungle

How to Create a Professional Online Resume in WordPress

Are you looking to create an online resume with WordPress? Adding a professional resume to your website allows prospective employers to easily find and contact you. In this article, we will show you how to build a professional resume in WordPress.

Things You Need Before You Start

You will need to have a domain name and a good web hosting company that knows WordPress. We highly recommend that you use Bluehost because they are an official WordPress recommended hosting provider. They will also give you a free domain and 50% off their hosting plan (special for WPBeginner users).

Since our users like options, we also recommend Siteground for WordPress hosting. They have the best support and have the same special offer for WPBeginner users.

You also need to make sure that you have installed WordPress. See our guide on how to install WordPress.

Also this tutorial is only for self-hosted WordPress.org sites and does not work on WordPress.com (see: WordPress.org vs WordPress.com – what’s the difference)

Creating an Online Resume with WordPress

First thing you need to do is install and activate the Resume Builder plugin. It works out of the box and there are no settings for you to configure.

Simply go to Resumes » Add New and start building your resume.

The resume builder provides an easy to use interface to create your resume. It is divided into two areas called sections and widgets.

First you need to click on the ‘Add Resume Section’ button. This is where you can add different blocks of information to your resume. You can choose to add either an introduction block or a default block.

Let’s add an introduction block first. This is where you can add introductory information about yourself, add a photo, and call to action buttons.

The photo you add needs to be exactly 237x303px in dimensions.

You will need to click on the ‘Add Button’ to add a call to action button. You can add multiple buttons.

In this example, we added two buttons one labeled contact and another labeled portfolio.

After adding the introduction block, you need to click on the Add Resume Section button and select default block.

We will be using the default blocks to add academic and professional information to the resume.

You can create a section called Education and then add subsections for each school/college.

After that you can create another section for experience and add each job as a new subsection.

Adding Contact Info Widget to Your Resume

The best thing about having an online resume is instant connectivity. Employers and clients can quickly send you a message, join you on IM, or call you directly. Resume builder makes it super simple to display your contact information.

Simply fill out the contact info form under resume widgets.

Adding Skills to Your Resume

Resume Builder also comes with a skills widget which allows you to add your skills, select your expertise level, and provide details for each skill.

You can add as many skills as you like by simply clicking on the add skill button.

Once you are done, simply click on the publish button to make your resume live.

Displaying Resume on Your WordPress Site

Resume Builder comes with a built-in WordPress resume template which works with almost every theme. Each resume you create has its own URL on your website. All you need is to add a link in your site’s navigation menu.

Simply go to Appearance » Menus and click on resumes tab to expand it. You will see the resume you just created. Check the box next to your resume and then click on the add to menu button.

You can now visit your website to see your resume in action.

If you don’t want to use default template, then you can use shortcodes to display your resume on any WordPress page on your site. You will find these shortcodes on the resume editing screen when you save or publish a resume.

Copy and paste these shortcodes on any WordPress page you want to embed your resume.

You can change the style and appearance of your resume using CSS in your theme’s stylesheet. An easier way to do that is by using the CSS Hero plugin. It allows you to change appearance of any element using a simple user interface and without writing any CSS or HTML.

Conclusion

The advantage of using a WordPress resume plugin like Resume Builder compared to using a WordPress resume theme is that you can change the design of your site at anytime without losing any functionality.

When you use a WordPress resume theme, you are forever restricted to using that theme. When you switch themes, you lose all the information and would have to recreate your resume.

Whereas a resume plugin will work with all themes even when you change your theme, all your data would be there.

We hope this article helped you build a professional resume in WordPress. You may also want to see our guide on how to add a portfolio to your WordPress site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

To leave a comment please visit How to Create a Professional Online Resume in WordPress on WPBeginner.

How to Add Title and NoFollow to Insert Link Popup in WordPress

Do you want to add a title and nofollow tag to your WordPress links? By default WordPress does not provide a user interface for adding those attributes. In this article, we will show you how to add title and nofollow to insert link popup in WordPress.

Why You Need Title and NoFollow for Insert Link Section in WordPress

By default when a user click on the insert link button in WordPress, they see a popup like this:

It allows you to add the Link URL and the Link text (also known as anchor text). You can optionally choose to open the link in a new window. This will create a basic link that will look like this in the HTML view:

<a href="http://example.com" target="_blank">Example Website</a>

Often SEO experts recommend that you use rel=”nofollow” attribute on external links. This attribute tells search engines that they can crawl these links, but you don’t want to pass away any link authority to these websites.

Similarly, the title attribute in a link allows you to add a description of the page you are linking to.

It lets users know what they will find when they click on the link. Both these fields are important from an SEO point of view.

In WordPress 4.2, the core team decided to remove the title field in WordPress. Quickly came several plugins that would restore the title field, but they weren’t compatible with the nofollow plugins.

Since we needed both functionality on our site, we searched endlessly until we found a solution that works.

Adding Title and NoFollow Fields in Insert Link Popup

First thing you need to do is install and activate the Title and Nofollow For Links plugin. It works out of the box, and there are no settings for you to configure.

Simply edit or create a new WordPress post and then click on the insert link button in the post editor. The insert link popup will appear, and you will notice the restored Title field and a checkbox to add the nofollow attribute to the link.

The HTML of your hyperlink with a title and nofollow attributes will look like this:

<a href="http://example.com" title="Example Domain" rel="nofollow" target="_blank">Example Website</a>

That’s all. We hope this article helped you add title and nofollow to insert link in WordPress. You may also want to see our list of 40 useful tools to manage and grow your WordPress blog.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

To leave a comment please visit How to Add Title and NoFollow to Insert Link Popup in WordPress on WPBeginner.

How to Add Email This Option to Your WordPress Posts

Do you want to add an “Email This” button to your blog posts? Word of mouth is probably the most effective marketing technique. By allowing users to email your articles from your website can bring in new visitors and customers. In this article, we will show you how to add an “Email This” option to your WordPress posts.

First thing you need to do is install and activate the WP-EMail plugin. Upon activation, you need to visit E-Mail » E-Mail options page to configure the plugin.

You can leave the SMTP settings blank if you are not using an SMTP server or third-party email service like Mandrill.

Next, you need to choose the email text and icon. Under the email settings, you can select email content type and fields that users will see on the email form.

In the email sending method, you can use PHP or Sendmail. If you are using an SMTP server, then you need to select SMTP as your email sending method.

WP-EMail allows you to set a character limit to be used as excerpt in the email. We recommend you to use 100 to 250 characters. This will give the email recipient an idea of the content, and they will have to visit your website to view the full article.

The next part of the settings page allows you to configure the outgoing email template. The default template should work for most websites. However, you can change it using the available template tags.

Don’t forget to click on the save changes buttons, to store your settings.

Important: One last but crucial step is to update your Permalink settings.

Simply visit Settings » Permalinks page and click on the save changes button. You don’t need to change anything. By just saving the permalink structure will referesh your .htaccess file.

Displaying Email This Button in WordPress

After configuring the plugin, the next step is to add the ‘Email this’ button on your WordPress posts and pages.

Method 1: Using The Shortcode

If you just want to add the email button to selected few posts or pages, then you can use this shortcode into your post’s content.

[email_link]

If you want to add email this link to all your pages, then you can use the same shortcode in a text widget as well.

However, WordPress by default does not allow shortcodes to be used inside text widgets. To enable shortcodes in text widgets, you need to add this code in your theme’s functions.php file or a site-specific plugin.

add_filter('widget_text', 'do_shortcode');

The downside of using the shortcode is that you will have to add this to your posts manually, or if you are using it in a widget, then the email option will be separate from the actual content.

Method 2: Editing Theme Files

If you are comfortable editing code, then you can add the following code in your theme’s functions.php file or in a site-specific plugin:

//Add Email This Option to Bottom of Post
function wpb_custom_emailthis($content){
if (is_single()) {
	$emailthis = email_link('', '', false);	
	$content .= '<p>' . $emailthis . '</p>';
}
	return $content;
}

add_filter( "the_content", "wpb_custom_emailthis" );

The code above will add the Email This link at the bottom of all your single post pages.

Alternatively, you can use the emal_link parameters and add it directly inside your single.php for more customized display.

We hope this article helped you add email this option to your WordPress posts. If you are having issues sending or receiving emails, then please take a look at our guide on how to fix WordPress not sending email issue.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

To leave a comment please visit How to Add Email This Option to Your WordPress Posts on WPBeginner.

Topher DeRosia Launches GoFundMe Campaign to Attend WordCamp Pune, India

Topher DeRosia, founder of HeroPress, is asking for $2,150 to attend WordCamp Pune, India. DeRosia was asked to speak about HeroPress by Saurabh Shukla, who is a HeroPress contributor and also the lead organizer of WordCamp Pune, India.

In an effort to be transparent, DeRosia published how he will spend the money.

• $1400 for the plane ticket
• $300 for hotel
• $200 for food, cabs, Uber, etc
• $100 for emergencies
• $150 for GoFundMe’s fees

If DeRosia has money left over from his trip, he plans to sponsor a WordCamp that’s having difficulty finding sponsors or donate it to the WordPress Foundation.

Since launching the campaign a few days ago, he’s raised $1,000. Unlike most other campaigns, donors can choose the amount they want to give. Among the donors listed is Matt Mullenweg, who contributed $250. If you enjoy the time, work, and effort put into HeroPress, consider donating a few dollars.

BuddySlack Plugin Sends BuddyPress Activities to a Slack Channel

Not long after the WordPress project adopted Slack as its primary form of communication, David Bisset started using it to help organize WordCamp Miami 2015. The application added real time communication for organizers, speakers, volunteers, sponsors, and the public. He found it to be a helpful addition to the WordCamp’s conference communication tools.

As a new fan of the platform, Bisset decided to build an extension for those who want to use Slack with BuddyPress. BuddySlack is his first plugin released on WordPress.org. The bare bones plugin will send a notice to Slack whenever an activity stream item is generated by any of the following core components:

• Members
• Profiles
• Activity
• Groups

The plugin allows you send your selected stream of activity posts to a particular channel, private group, or as a direct message to a user on your Slack team. It also includes an optional Slack settings panel within BuddyPress user profiles, allowing them to opt out of having their activities sent to Slack.

In order to use the BuddySlack plugin, you’ll need to set up an incoming webhook via Slack, which can then be entered into the plugin’s settings panel.

Bisset doesn’t plan on officially supporting the plugin but will add more features as time permits. He recognizes that it is currently somewhat limited, as it only supports sending activities for four default BuddyPress components. In the future, Bisset plans to expand it to support custom BP components as well as allow the user to customize the message sent to Slack.

Ideally, the plugin would allow you to set certain trigger words so that you wouldn’t have to send the entire stream of activities from a selected component. Right now the best use for BuddySlack might be on a smaller social network that doesn’t have a constant stream of activities. For example, if the Groups component is used sparingly, sending group activity stream posts to a specific Slack channel could be useful. Being able to narrow it down to a specific group would be even better.

The Slack plugin for WordPress allows you to set up multiple integrations for sending notices to different channels. It also allows for sending test notifications and temporarily disabling notices. These might be a few handy features that could benefit BuddySlack. Bisset is accepting pull requests if anyone wishes to contribute to the plugin on GitHub.

Slack integration via a plugin is also available for bbPress, WooCommerce, Easy Digital Downloads, Contact Form 7, and Gravity Forms.

Highlights of Matt Mullenweg’s Q&A Session at WordCamp Europe 2015

Kari Leigh | Found Art Photography

The video of Matt Mullenweg’s Q&A session at WordCamp Europe is now published on WordPress.tv. For those who were unable to attend, this session provides a glimpse into what WordPress’ co-founder sees for the future of the software and the community.

One of the most exciting parts of the video is where Mullenweg talks about the potential of WordPress.org to serve other languages and eventually expand avenues of core contribution to non-English speaking audiences.

When asked what kind of contribution can be made to improve WordPress.org for Rosetta sites, themes, and plugins, Mullenweg replied:

Themes and plugins are undoubtedly the most important. To me, the next most important things are the Rosetta sites and having theme and plugin directories available on the Rosetta sites. There is actually a great example at ro.wordpress.org, which is the Romanian Rosetta site that shows both the potential and the problem:

Now there are themes and plugins menu items there, which none of the Rosetta sites have had prior to this. But when you click on it you see mostly English in the plugin descriptions, even things like screenshots and tutorials.

He described these updates to WordPress.org as just a “hint of what could be amazing” one day. Mullenweg noted that despite Europe having 23+ recognized languages, attendees at the WordCamp were all speaking English. However, not all areas of the world are populated by people with bilingual capabilities.

I think it would be amazing to open up WordPress to have a first priority experience of the thousands of plugins and themes that are available for people who do not speak a word of English. Right now WordPress is just not accessible to that group. Luckily, over half the people in Europe are bilingual… In places where that’s a possibility, WordPress can still do well even though we don’t have a native experience in someone’s mother tongue.

But English is only the third most popular language in the world and it’s not the fastest growing. There are huge audiences that I think would be an important part of the community. Someday I want it to be where, instead of things being translated from English to a different language, we’re getting core contributions translated from, say, Chinese or Hindi or Spanish, into English to be reviewed. We’re not looking to just how to translate plugins from English into other languages but vice versa. I think that will be when we’re successful.

In the same way that better language support opens up WordPress to a wider audience, Mullenweg believes that the customizer will open up the software for more non-technical users. During the Q&A he shared his thoughts on the future of the customizer:

As we currently are working, the customizer is the way forward…It essentially removes the fear and disconnect between wp-admin and the front end of a site. It’s a bridge that gives people the confidence to make changes while seeing those changes in real time. The real time feedback and safety net of seeing that, and being able to undo and redo things, is incredibly empowering, particularly for non-technical users who don’t know how to dive into CSS or the code. I personally believe that the work on the customizer is some of the most important going on in the WordPress project right now.

In addition to building the feature in a way that is responsive to mobile devices, Mullenweg noted that the customizer currently falls short on desktop:

The customizer is, for lack of a better word, a narrow interface, because it needs to show your site in addition to the admin. I think we need to do a better job of making sure that interface scales up as well as down, meaning that if you do have the space or would like to make it fullscreen, that it is responsive, so that it enlarges into an interface that probably looks and works much like the current wp-admin interface for being a fullscreen experience for editing and modifying menus, widgets, colors, fonts, header images, site title, all the things that are key to the presentation of your site.

It is curious that the customizer is being pushed through to WordPress 4.3 without the ability to scale up gracefully. If the situation were reversed, where the feature was unfriendly to mobile users, it seems less likely that it would have been deemed ready for core. This illustrates the WordPress project’s strong emphasis on being positioned to attract mobile users.

Mullenweg encouraged attendees to keep an eye on the customizer, because he believes it will do a much better job than Wix and Squarespace when it comes to providing a user-friendly way to customizer websites.

The entirety of the 66-minute long Q&A session is included in the video below. In addition to languages and the customizer, Mullenweg also answers questions about security, WordPress’ minimum PHP version, the possibility of multilingual features in core, and the importance of building for mobile.

Stack Exchange Blog Ditches WordPress for Jekyll

Last week Stack Exchange announced its new blog, revamped to publish company news and engineering posts. The first post on the blog, written by Jon Chan, Stack Overflow’s developer evangelist, made no small amount of fanfare over migrating from WordPress to Jekyll.

Chan’s explanation of the team’s process cites a few curious reasons for their dissatisfaction with WordPress:

During the original proposal stage for the engineering blog, we also had a conversation about what engine we would use. At the time, all of our blogs were running WordPress…which we weren’t so happy about. It was very buggy, difficult to log in to, not very performant, and has caused our SRE team more than a few headaches. If we were really going to revamp the new company blog, it seemed like a lot of work to try and wrestle with our WordPress installation.

With a little bit of WordPress skill, these seem like easy complaints to resolve, especially given that Chan said the team was inspired by blogs like Code as Craft and OkTrends, both powered by WordPress. However, anti-WordPress sentiments continue to run high within the Stack Overflow community, which recently ranked the software as the third most dreaded technology.

photo credit: StackExchange Blog

After a great deal of consideration, the Stack Exchange team opted to use a static engine, eventually landing on Jekyll. Chan outlined the advantages they perceived in the move:

• Posts are in Markdown, something most of our company was familiar with
• Jekyll is just static site generation, so it’s much more performant
• Complete flexibility for front end work, no need to wrestle with templates
• Open source with a strong community, which we love
• Not WordPress or PHP

Chan described the migration process, an endeavor that was fraught with obstacles. There is a Jekyll Exporter plugin available to those who want to migrate their blogs over, but Stack Exchange opted to use the exitwp tool to get them most of the way there.

Since Jekyll doesn’t offer native support for comments, one of the biggest challenges in the migration was preserving that content and porting it into a new system. The Stack Exchange team decided to use Disqus for comments but were unable to properly migrate their existing comments and had to craft an alternative solution.

“The worst part of this is how unsupported we were by the Disqus team,” Chan said. “We waited on the order of weeks for support responses and for over a month they went unresolved. Sending in official support tickets, emails, and posts on their Discuss forum went unnoticed.”

Despite their unsatisfactory experience with Disqus and the fact that they have to sacrifice Stack Exchange login capabilities in order to use it, Chan said they will continue with it going forward.

If you’re running a large, high profile blog on WordPress, it requires a certain level of expertise to customize themes and plugins and to ensure a high level of performance. It’s unclear whether or not the Stack Exchange team was lacking in expertise (based on some of the complaints cited) or simply unwilling to continue with WordPress after unsatisfactory experiences. No massive migration from one platform to another is ever going to be easy and bug-free, but Chan’s account offers some valuable insight on how difficult it currently is to move from WordPress to Jekyll while preserving all of your content.

BuiltWith Reports a 7% Increase in WordPress’ Usage from January – July 2015

photo credit: Luis Llerena

BuiltWith, the popular service dedicated to monitoring internet technology trends and providing platform usage analytics, released its bi-annual internet coverage report for CMS usage from January – July 2015. The report shows that WordPress, which accounts for 48% of total CMS’s tracked, added 1.1 million domains since January.

WordPress has been found on an additional 1.1 million domains since January but only accounts for a 7% increase in customer base. Whereas Ghost was added to 2,184 domain home pages and accounts for a 17% increase in their customer base.

The title of the summary is “CMS Market Share Increases by Install Base,” but WordPress is the only CMS shown in the chart with an actual market share value assigned based on its place among tracked competitors.

BuiltWith indexed 328,852,063 domains during this quarter. Instead of simply showing the increase by usage numbers, the summary focuses on the percentage increase in customer base for a more interesting comparison. When commenters noted that this is not, in fact, market share data, Ghost co-founder John O’Nolan replied, “Relative growth compared to existing size is pretty much the only sane measure.”

@JohnONolan Strange perspective. Ghost added 17% or 2,184 domains. WordPress added 7% or 1,149,956. That's only 535 times more sites ;)

— Aigars Silkalns (@AigarsSilkalns) July 7, 2015

Oddly, the report did not share any figures for Drupal or Joomla, which W3techs estimates as WordPress’ closest CMS competitors in terms of market share. BuiltWith’s summary appears to be limited to the fastest growing platforms based on percentage increase in customer base.

The CMS report also included some interesting stats on the WordPress versions it detected on sites indexed. These numbers roughly correspond to the project’s version usage stats, although WordPress doesn’t publish numbers for versions older than 3.0. BuiltWith found that 1748 websites are still running on WordPress 2.1, released eight years ago. This number is down 259 sites since the beginning of the year.

photo credit: BuiltWith

According to Gary Brewer, founder of BuiltWith, “Wix and Squarespace’s main acquisition for existing websites that are using a CMS are from WordPress sites.” He also notes that WordPress continues to dominate without the help of celebrity advertisements. Wix’s ad with Heidi Klum and Squarespace’s Jeff Bridges commercial, which aired during the Super Bowl, are evidence of both companies’ massive marketing budgets. WordPress.com, the world’s leading provider of free WordPress sites, has yet to explore that route.

WordPress 4.3 Improves User Search and Turns Comments Off on Pages by Default

WordPress 4.3 beta 1 was put into the hands of testers last week. Those who have been following 4.3 developments are already familiar with the major features headlining this release, ie. the new site icons, menu management in the customizer, and more secure passwords. However, there are also a couple lesser-known improvements that will have a positive impact on millions of WordPress users.

Improved User Search

Searching for users in the admin is about to get much easier, thanks to work on a ticket opened by John Blackbourn 16 months ago. He notes that “only the user_login (username) and user_nicename (sanitized username) fields are searched,” excluding the following more likely fields:

• First name
• Last name
• Nickname
• Display name

This issue was especially problematic in large, multi-thousand member multisite installations where finding a user in the admin often meant knowing exactly what to query and then paging through results. WordPress 4.3 contributions from Pippin Williamson and Scott Taylor make it possible to search by the user’s email, URL, and display name.

Comments Turned Off on Pages by Default

WordPress 4.3 will also bring a welcome change to turn off comments on pages by default. In the future when you create pages, you won’t have to remember to go into the discussion settings to disable comments. One might think this would be a simple little thing to change, but quite a bit of discussion has gone into crafting the best solution to the ticket opened five months ago.

This change also applies to all custom post types. Mel Choyce outlined the new behavior in a post on the make.wordpress.org/core blog:

Post registrations that don’t explicitly add support for comments will now default to comments being off on new posts of that type (before, they defaulted to on). Up until now, post type support for comments has only affected admin UI; a developer could omit comment support on registration but still allow comments to be posted. This is a change in behavior, and we will be closely monitoring its effects during beta. Moving to explicit support will allow core behavior to be more predictable and robust in the future, but we will always consider real-world usage.

The change also comes with a new function and a filter that you can use to restore the current behavior of comments to your post type, if necessary. More details and an example on how to use the filter are available on the make.wordpress.org/core announcement post.

What’s Coming in WordPress 4.3 (Features and Screenshots)

After the release of WordPress 4.2 in April, development of the next major release WordPress 4.3 started in full swing. We have been following the development closely and are excited to report that WordPress 4.3 is expected to be released next month. In this article, we will show you what’s coming in WordPress 4.3 with features and screenshots.

Note: You can try out the beta version on your computer or on a staging environment by using the WordPress Beta Tester plugin.

Editing Menus in Customizer

With a heavy push for the theme customizer adoption, WordPress core team is slowly moving all theme options one by one to the customizer screen.

Widgets management was added to the customizer in WordPress 3.9, and theme switching was added in WordPress 4.2.

WordPress 4.3 will allow you to manage your navigation menus from the theme customizer.

While you can still manage and edit your menus using the old interface, the goal of this new addition is to allow users to customize all their theme settings from one settings page with a live preview.

This change was met with heavy resistance by some very notable members of the community. It would be interesting to see how the customizer evolves in the next versions.

Adding Site Icon or Favicon

Favicon or site icon is the tiny icon that you see next to a site’s name in your web browser. In the past, WordPress users had to use a plugin to add a favicon or add it manually by editing their theme files.

WordPress 4.3 will allow you to upload your site’s favicon or site icon from the WordPress admin area. Simply visit Settings » General and upload an image for your site icon.

WordPress will allow you to crop the image and will also show you a live preview of how it will look in browsers and as a mobile icon.

Better Passwords

WordPress 4.3 will introduce a new user interface for the password reset screen. It will automatically fill in the new password field with a strong password.

When you add a new user, WordPress will now send them a password reset link instead of a pre-selected password in plain text. During the process you also have the option to click on the show password button and add a password for the new user. WordPress will show a strong password auto-filled when you click on the show password button. You can change that to your own password if you want.

The goal here is to make sure that users understand the importance of using strong passwords. You may also want to take a look at our tutorial on what’s the best way to manage passwords for WordPress.

Editor Improvements

Many WordPress site owners spend most of their time writing posts. If you use the visual editor, then you will notice that moving your mouse to click on formatting buttons slows down your writing pace.

With 4.3, WordPress is introducing inline text shortcuts. These shortcuts are similar to Markdown which allows you to format text and add element using simple markup in the text. However, unlike Markdown these text patterns will immediately transforms patterns into HTML.

Using * or – will start an unordered list.
Using 1. will start an ordered list.
Using # will transform into h1. ## for h2, ### for h3 and so on.
Using > will transform into blockquote.

This is surely going to speed up writing for power users.

Visual/Text Editors in Press This

In WordPress 4.3, the Press This tool will get a full featured visual and text post editor. This will make it easier to create posts quickly with proper formatting tools.

Under The Hood Developments

In WordPress 4.3 shared terms on multiple taxonomies will now split up. This is part of the ongoing taxonomy improvement roadmap. (#30261)

In WordPress template hierarchy, singular.php file will now act as the default fallback template for single.php and page.php. (#22314)

WordPress 4.3 will allow developers to select a primary column when using list tables like on the Posts, Pages, or Media Library screens. (#25408)

We hope this article gave you a glimpse into what’s coming in WordPress 4.3. Let us know which features you are excited about and what you would like to see in future releases of WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

To leave a comment please visit What’s Coming in WordPress 4.3 (Features and Screenshots) on WPBeginner.

Automattic Overhauls VideoPress and Open Sources Technologies Used to Build It

VideoPress, Automattic’s video hosting service, has undergone a complete overhaul. The video player is now responsive and adjusts well to mobile devices. Videos can be embedded anywhere and are easier to share, thanks to permalinks.

There’s also a couple of neat options for sharing videos. Similar to YouTube, you can select a time stamp where the video will start playing. You can also loop and autoplay videos.

VideoPress Sharing Options

One thing I noticed is that pasting a VideoPress permalink into the self hosted WordPress visual editor does not load the video. This is because WordPress does not have oEmbed support for VideoPress.

To embed videos into posts, you need to copy the HTML embed code from the video and past it into the WordPress text editor. Pasting the code into the visual editor doesn’t work. Guillermo Rauch, who works on the VideoPress team at Automattic says they are working on adding oEmbed support.

The new video player takes up little space and is unbranded. According to Rauch, the player’s skin and behavior is controlled by JavaScript, HTML and CSS. This opens the door for customizations by theme developers in the future. Thanks to major performance enhancements, pages with videos on them will load faster, even for those on slow internet connections. Here’s an example of a video using the new player.

A feature that I think a lot of people will enjoy is real-time seek which lets you skim through videos and helps you start playing at a desired point. Last but not least, the libraries used to build the new video player have been open sourced, including jpeg-stream, pixel-stack, and video-thumb-grid.

If you’re interested in using VideoPress, you need a Premium or Business plan on WordPress.com. The premium plan is $99 per year and includes 13GB of space. Videos take up a lot of space and one has to wonder if it’s worth the cost or if YouTube is a better option. If you use VideoPress, let us know what you think of these improvements.

How to Use LinkedIn Showcase Pages for Business

Are you looking for more ways to use LinkedIn for your business? Have you considered showcase pages? LinkedIn showcase pages enable you to promote certain products or services to specific customer segments. In this article you’ll discover how to use LinkedIn showcase pages for your business. What Are Showcase Pages? Showcase pages are an extension […]

This post How to Use LinkedIn Showcase Pages for Business first appeared on Social Media Examiner.
Social Media Examiner - Your Guide to the Social Media Jungle

WordPress 4.3 Beta 1 Now Available for Testing

WordPress 4.3 is right around the corner with beta 1 released and ready for testing. According to the 4.3 project schedule, there will be no more commits for new enhancements or feature requests from this point on. Contributors are now focusing on bug fixes and documentation ahead of August 18th, the target release date.

With all the controversy surrounding WordPress 4.3’s inclusion of menus in the customizer, you may have missed a few other lesser known features that are on track to be included and need to be put through the paces. The new site icons feature was added to trunk this week, along with a text editor for the Press This posting interface.

WordPress lead developer Mark Jaquith has been working on making passwords more secure. As of 4.3, WordPress will no longer send passwords via email. The password strength meter is now more tightly integrated. It will warn users upon selection of a weak password and can also suggest a secure password.

One interesting new improvement added to the post editor is recognition of some basic markdown-esque patterns inside TinyMCE:

Certain text patterns are automatically transformed as you type, including * and – transforming into unordered lists, 1. and 1) for ordered lists, > for blockquotes and one to six number signs (#) for headings

For those who are used to formatting text this way, the post editor in WordPress 4.3. will be a more friendly place for speedy composition.

Admin post and page list tables will take a huge leap forward to become more responsive in this release, improving the experience of using WordPress on smaller screens. Previously, the columns that could not fit were truncated, but WordPress 4.3 will allow columns to be toggled into view.

Check out release lead Konstantin Obenland’s beta announcement post to download a zip of the beta. If you want to help test, the easiest way is to get hooked up via the WordPress Beta Tester plugin. Bug reports are welcome on the Alpha/Beta support forums and can also be filed on WordPress trac.

Which One of These Six Cities Should Host WordCamp US?

When Matt Mullenweg put out the call to cities interested in hosting WordCamp US, we learned the criteria they would have to meet in order to qualify. Venues would need to seat approximately 1,000-2,00 people, have hotels within 3 miles of the venue, hotel costs for a range of budgets, and average flight costs from the West Coast, East Coast, Midwest, Mexico, and Canada.

Applications to host WordCamp US 2015 officially closed today. Six cities submitted applications to host the event, they include:

• Chattanooga
• Chicago
• Detroit
• Orlando
• Philadelphia
• Phoenix

On the Make WordPress Community site, Cami Kaos says applications are being carefully reviewed and organizers of the host city will be contacted as soon as possible. Dates for the event won’t be given until a host city and venue is chosen.

Out of all the cities selected, I want WordCamp US to be in Chicago. I love Chicago and it’s a quick flight from Cleveland. The city also has awesome pizza. Take the poll below and vote for which city you think should host WordCamp US. This poll is only for fun and will not affect the outcome of the host city.

Note: There is a poll embedded within this post, please visit the site to participate in this post's poll.

How to Craft Instagram Posts That Drive Sales

Do you use Instagram to promote your products and services? Interested in ways to drive sales with your posts? A good Instagram post is not as simple as just snapping a photo, applying a filter and posting it to your news feed. To have a real impact, your posts need to be carefully crafted and […]

This post How to Craft Instagram Posts That Drive Sales first appeared on Social Media Examiner.
Social Media Examiner - Your Guide to the Social Media Jungle

WordPress 4.3 Adds New Site Icons Feature and a Text Editor to Press This

WordPress 4.3 is on track to include a new site icons feature, which will allow administrators to easily upload an image to be used as the favicon and app icons for a site. Favicons have traditionally been handled by WordPress themes or plugins, but the new core support means that users no longer have to hunt down an extension to handle this basic site feature.

This addition landed in 4.3 in response to a four-year old trac ticket requesting an easier way for non-technical users to upload and crop an image to use as a favicon. Konstantin Obenland, release lead for 4.3, committed the feature to WordPress trunk this week, along with the following summary of its current capabilities:

This v1 marries Jetpack’s Site Icon module with the Media Modal, reusing code from the Custom Header admin. For now, the core-provided icons will be limited to a favicon, an iOS app icon, and a Windows tile icon, leaving .ico support and additional icons to plugins to add.

After testing WordPress 4.3-alpha, I found that the experience of adding a favicon in the settings panel is smoother and more intuitive than any plugin I’ve ever tried. The screen offers users a nice preview of the image as a favicon and mobile icon. It also doesn’t burden you with any notices about sizes and image quality, unless you attempt to upload an image that is less than 512px in width.

If you want to test the feature, you can provide feedback on the ticket or via the announcement post.

Another major enhancement added to 4.3 this week is a text editor for Press This. Many WordPress users appreciate the streamlined simplicity of the Press This post editor but were held back from using it to compose posts due to the lack of HTML editing support. The addition of a text editor offers the same capabilities as the standard editor in post-new.php.

Press This will also receive a few polishes in addition to the text editor, including auto-scrolling when the caret moves out of the viewport while the user is typing (similar to editor-expand) and auto-resizing for the textarea. WordPress 4.3’s improvements to Press This are not exactly a replacement for the dearly-departed distraction-free writing mode, but the post editor at wp-admin/press-this.php is quickly becoming one of the more zen-like interfaces in the admin.

WordPress for iOS 5.3 Released With Refreshed Stats and a New Layout for Posts and Pages

WordPress for iOS 5.3 is available on iTunes and has a few new features. Post listings display more content making them easier to browse. A search feature has been added to the post listing screen that displays results as you type.

Search bar in WordPress for iOS 5.3

I tested the search feature on two different sites. The first site is on WordPress.com and doesn’t use featured images. Search results displayed quickly with little lag.

The second is a self hosted WordPress site that uses featured images. I noticed lag as the app tried to display real-time results as I typed which also lagged the app. I couldn’t do anything else within the app until the search query finished.

I don’t use the search feature often and this experience has me concerned. Instead of being fast and fluid, it’s chunky and slow. I also don’t see the need to display featured images in search results. I think this would make the search query and the app faster.

WordPress.com and self hosted WordPress sites are now combined under My Sites. Instead of seeing a spinning circle when checking stats, there’s a progress bar at the top. This gives the appearance that the stats page loads faster. The stats page also has a subtle color scheme change that makes things more pronounced.

WordPress for iOS 5.3 Stats Page

Last but not least, 5.3 includes several bug fixes. Overall, 5.3 is a decent update. Remember to use caution when searching a site with a lot of posts that use featured images. WordPress for iOS 5.3 is available for free on iTunes. If you encounter any issues in 5.3, please report them in the support forum.

Argent: A Free Portfolio Theme for WordPress

Argent is a bold new portfolio theme that was launched on WordPress.com last week. The theme is centered around showcasing the work of visual artists such as designers, photographers, craft makers, painters, etc., with portfolio items featured prominently on the homepage template.

Argent was designed by Mel Choyce, co-author of the popular Flounder and Aventurine themes. Her designs are generally very focused and Argent is no exception. While the theme is well-suited to a wide range of creative professionals, it wasn’t designed to be an agency/business/blogging theme all in one. Argent is clearly a portfolio theme right out of the gate.

Artists won’t need to fight with this theme to simplify it down to something that’s easy to personalize. The theme’s customizer options allow you to display 3, 6, or 9 portfolio projects on the homepage template. It also includes controls for changing the header and background images and text colors.

All of the content on posts and pages is centered. There is no sidebar, but Argent includes support for three footer widget areas.

When used on a self-hosted WordPress site in combination with Jetpack and its Custom Content Types module, you can add portfolio projects. Each portfolio item includes support for a full-width image carousel. This is automatically generated from the first gallery included in the portfolio post.

One thing to appreciate about the blog section is that you don’t have to worry about having excessively large, oddly-shaped featured images to make it look like the demo. Argent’s blog archives template is simple with short, one-sentence excerpts and small rectangular featured images.

Typography is never an afterthought in Choyce’s designs, and Argent places a strong emphasis on readability. The theme features the contrasting “Alegreya” font for headers and quotes and “Cabin” for paragraph text. It also includes styling for right and left pullquotes to emphasize text.

If you’re on the hunt for a new portfolio theme, check out a live demo of Argent. Given the small number of design options to configure, artists will have an easy time getting their works online.

The theme hasn’t yet hit WordPress.org but should land there soon. In the meantime, self-hosted WordPress blog owners can download it from the sidebar of the theme’s description page on WordPress.com.

WP TogetherJS Plugin Adds Real Time Collaboration to WordPress

If you’re collaborating with colleagues on a design or trying to show a client a few changes you’ve been adding to their website, the easiest way to get on the same page is with some form of screen sharing software. However, many of these tools are a pain to hook up and sometimes they require both parties to have accounts with the service.

WP TogetherJS is quite possibly the most simple real time collaboration plugin I’ve ever tried with WordPress. It seamlessly integrates Mozilla’s free, open source TogetherJS library to add real time collaboration tools to any website.

TogetherJS’ basic features include:

• Collaborative browsing
• Shared cursors
• Text chat
• Audio chat via WebRTC
• Real Time Content Sync

WP TogetherJS has no options to configure. After installing it, you can be collaborating with a visitor in under a minute. TogetherJS can be enabled with one click from the WordPress admin bar. The person invited to the collaboration session simply visits the unique TogetherJS URL – there are no accounts to sign up for or hoops to jump through.

Once the other person opens the link, you’ll be able to see each other’s mouse/cursor position and clicks while tracking each other’s browsing. You can even invite multiple visitors to participate in the session.

Please note that this plugin is not useful for collaborative content creation. You’re still going to run into WordPress’ post locking feature, implemented in 3.6 using the Heartbeat API, if you attempt to edit a post together. WordPress’ publishing tools cater to single author publishing workflows, and the WP TogetherJS wasn’t designed to overcome this.

The plugin is more useful for quick training sessions, live support, client meetings, and any situation where you need a quick way to share screens during a conversation. If you want to get a better idea of how it works, the TogetherJS website has a number of live demos you can launch near the bottom of the page.

WP TogetherJS was created by software developer Ryan Nielson and is a super lightweight plugin – it simply enqueues the Together.js script from Mozilla. If you need a quick way to collaborate with a visitor, download WP TogetherJS from the WordPress.org plugin directory.

WPWeekly Episode 196 – Interview with Joshua Millage and Mark Nelson of LifterLMS

In this week’s episode, Marcus Couch and I are joined by Joshua Millage, host of the Infusioncast and LMScast podcasts and Mark Nelson, lead developer of codeBOX and LifterLMS.

In the first half of the show, Millage explains the versatility and power of Infusionsoft, especially when it’s integrated with WordPress. He shares what motivated him to create the Infusioncast podcast, a show dedicated to covering the Infusionsoft community.

During the second half of the show, we learn what LifterLMS is capable of and discuss course management software in general.

Plugins Picked By Marcus:

Quick Save lets you update posts and pages using the ALT key in addition to clicking the Publish and Update button.

WP Revealer is a WordPress content display plugin that hides content and displays it at a precise time.

WPWeekly Meta:

Next Episode: Wednesday, July 1st 9:30 P.M. Eastern

Subscribe To WPWeekly Via Itunes: Click here to subscribe

Subscribe To WPWeekly Via RSS: Click here to subscribe

Subscribe To WPWeekly Via Stitcher Radio: Click here to subscribe

Listen To Episode #196:

How to Properly Use the More Tag in WordPress

Do you want to a show a summary of your article on your homepage with a read more link? WordPress comes with two built-in methods that allows you to do that. One of these methods is known as the More Tag. In this article, we will show you how to properly use the More Tag in WordPress.

Adding the More Tag in WordPress

Adding the More Tag in your posts is quite simple. Simply start by writing a new post or edit an existing one.

Once you’re done writing, you will need to click on a line where you would like to end the summary and show a read more link. Next, click on the More Tag button from the toolbar.

You will notice that a dashed line with ‘More’ in the center will appear in your blog post. You can insert the more tag anywhere in the post, like in the mid sentence, in the middle of a paragraph, or after the first paragraph.

If you are using the text editor, then you can use the ‘more’ button in the toolbar or manually enter the more tag like this:

<!--more-->

What’s the Advantage of using More Tag vs Excerpts

Remember earlier we mentioned that WordPress comes with two built-in methods for showing the post summary with read more link. Those methods are More Tag and Excerpts.

You can add an excerpt for any post using the Excerpt box in your post editor screen. If you do not see that box, then click on the screen options tab on the top right hand corner and check the excerpt option.

This will display an excerpt meta box below your post editor.

While excerpts may sound like an easier option, there are two downsides to using an excerpt.

The first is that excerpts are completely theme dependent. If your theme does not use the_excerpt tag, then no matter what you type in the excerpt box, your theme will show the full content of your post on your homepage and archive pages.

The second downside to using excerpts is that they do not show images or any other formatting for that matter. They’re displayed as plain text.

Whereas the More Tag is completely theme independent meaning it will work on all well-coded WordPress themes. Second, it allows you to display images and all post formatting such as links, quotes, bold/italics, etc in your post summary.

What’s the Downside of using More Tag

The biggest downside of using the WordPress More Tag is that it is something you have to manually enter in all of your posts whereas excerpts are automated.

While WordPress allows you to enter a custom excerpts in the excerpt box, it can also auto-generate an excerpt based on your character count.

Depending on your preference, this may be a downside.

The other downside of using a More Tag is if you use a theme that uses excerpts, then it will override the More Tag and provide an excerpt with the length defined by your theme.

Whether you use More Tag or excerpts, it’s important that you show a summary on your homepage and archive pages rather than showing full content. See our article on the topic, full Text vs summary (excerpt) in your WordPress archive pages.

Common WordPress More Tag Problems

The biggest issue we hear with WordPress More Tag not working is when it comes to pages.

By default, you cannot use the More Tag in WordPress pages. However, there is a quick fix that allows you to add read more tag in WordPress pages.

Another common issue is more tag not working on homepage. If you are using a static page as your custom homepage, then the link above should fix the issue.

The only other reason why more tag won’t work on the homepage is if your theme is designed to show excerpts on the front page in which case your more tag is being overridden, and you should use excerpts instead.

We hope this article helped you learn how to properly use the more tag in WordPress. You may also want to check out our CSS Hero, a WordPress plugin that helps make design customization easy – see our full CSS Hero review.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

To leave a comment please visit How to Properly Use the More Tag in WordPress on WPBeginner.