O novo editor do WordPress: Gutenberg

Desde que o primeiro beta foi exibido no WordCamp Europe 2017, o novo editor do WordPress promete mudar 100% a experiência de edição de conteúdo do WordPress, vem sendo definido pela Automattic o novo “page and post building”. Algo que já vem sendo feito por plugins page builders a muito tempo, mas agora será um recurso default da plataforma e isso abrirá a possibilidade de um completo e novo ecosistema dentro da plataforma, o Editor já está disponível para teste como plugin mas será incorporado na próxima versão do WordPress 5.0.

Passado

Antes o editor visual cumpria seu papel quando era relacionado a publicação de textos simples, com a evolução da internet, a forma de postar e absorver conteúdo, e a penetração da plataforma na web (hoje presente em mais de 27% dos sites). Trouxe uma necessidade maior que o editor clássico não supria, a solução foi utilizar plugins page builders ou temas customizados integrados com metadados. Muitas vezes um usuário comum tinha que interagir com plugins muitas vezes complexos ou contratar um desenvolvedor para adaptar o WordPress para suas necessidades.

O que vem por ai

O Gutenberg promote mudar a experiência de uma grande texto corrido e agora criar blocos independentes com contextos específicos para cada bloco assim facilitando a criação de conteúdo com layout customizado. Agora você poderá criar posts e páginas usando blocos com vários tipos de conteúdo, por exemplo, imagens, vídeos, conteúdo derivado das mídias sociais, widgets e o melhor de tudo o usuário final não precisa utilizar HTML ou CSS.

Como funciona?

Se você está ansioso para testar o Gutenberg ele está disponível atualmente em plugin para isso você instalar o plugin disponível no link:

Gutenberg

Depois de instalado o Gutenberg irá modificar o seu editor clássico, para acessá-lo basta criar um novo post/página ou editar algo que já exista. Para ajudar você eu criei uma série de videos para explicar em mais detalhes como funciona o Gutenberg:

Para mais informações sobre o Gutenberg acesso o handbook:

https://wordpress.org/gutenberg/handbook/

 

 

 

Wordcamp Dublin 2017

Hi all, last year I arrived in Dublin and had a chance to participate on three Wordcamps in Europe. London, Vienna, and Belfast. The last one I did a presentation, was crazy because I replace a speaker 12 hours before the presentation. But in the end was nice the support that the community gives me, and I did my first presentation in Europe.

And this year I was selected to do a presentation on WordCamp Dublin 2017 will be my first WordCamp this year, Dublin is special because is a huge IT polo and Europe and a WordCamp here has a special meaning.  The event happens during two days  14 and 15 of October, two days talking about: Theme development, Boilerplating, Accelerated Mobile Pages, Content, SEO, Workflow, and E-commerce. You can check the schedule here:

Schedule

Who knows the WordCamp, know the price is so low compared other events. The tickets are priced at  €35.

Tickets

So have a look and see you there!

Feeding Google Search – Structure data

Content is one of the keys to the success on the internet, categorizing your content makes it more visible to the search engines and structure data will be your best friend to do it. This simple action could make you a step forward in the competitive market.  On 2011, Google, Bing and Yahoo launched an initiative called Schema.org, this project’s objective is to create and support schemas for structured data. And now this information start to be more relevant to the search engines, Google especially, uses the structure date to shows the content in a special format called Rich cards. Actually, Google.

Now, this information starts to be more relevant to the search engines, Google especially, uses the structure date to shows the content in a special format called Rich cards.

Actually, Google gives to us these options to pages enhancements: 

  • Breadcrumbs
  • Corporate contact information
  • Carousels for sequential results
  • Logos
  • Sitelinks Search box
  • Social profile links

Content types:

  • Articles
  • Books
  • Courses
  • Events
  • Job postings
  • Local businesses
  • Music
  • Products
  • Recipes
  • Tv and movies
  • Videos

For each situation, needs some required information, for example, recipes we will need to specify, numbers of calories, ingredients, and time to cook. Google uses the structure data to display these categories in a different layout in the search result, in that way help the users find the right content and increase the click rate for the websites that show the content with more quality.

Ok, what about the code?

There are three different formats JSON-LD(Recommended by google), Microdata and RDFa. For a long time, I used Microdata but now I’m working with different projects again and different markups the JSON-LD makes the changes simple.

Code examples:

JSON-LD

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "NewsArticle",
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "https://google.com/article"
  },
  "headline": "Article headline",
  "image": {
    "@type": "ImageObject",
    "url": "https://google.com/thumbnail1.jpg",
    "height": 800,
    "width": 800
  },
  "datePublished": "2015-02-05T08:00:00+08:00",
  "dateModified": "2015-02-05T09:20:00+08:00",
  "author": {
    "@type": "Person",
    "name": "John Doe"
  },
   "publisher": {
    "@type": "Organization",
    "name": "Google",
    "logo": {
      "@type": "ImageObject",
      "url": "https://google.com/logo.jpg",
      "width": 600,
      "height": 60
    }
  },
  "description": "A most wonderful article"
}
</script>

 

Microdata

<div itemscope itemtype="http://schema.org/NewsArticle">
  <meta itemscope itemprop="mainEntityOfPage"  itemType="https://schema.org/WebPage" itemid="https://google.com/article"/>
  <h2 itemprop="headline">Article headline</h2>
  <h3 itemprop="author" itemscope itemtype="https://schema.org/Person">
    By <span itemprop="name">John Doe</span>
  </h3>
  <span itemprop="description">A most wonderful article</span>
  <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
    <img src="https://google.com/thumbnail1.jpg"/>
    <meta itemprop="url" content="https://google.com/thumbnail1.jpg">
    <meta itemprop="width" content="800">
    <meta itemprop="height" content="800">
  </div>
  <div itemprop="publisher" itemscope itemtype="https://schema.org/Organization">
    <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
      <img src="https://google.com/logo.jpg"/>
      <meta itemprop="url" content="https://google.com/logo.jpg">
      <meta itemprop="width" content="600">
      <meta itemprop="height" content="60">
    </div>
    <meta itemprop="name" content="Google">
  </div>
  <meta itemprop="datePublished" content="2015-02-05T08:00:00+08:00"/>
  <meta itemprop="dateModified" content="2015-02-05T09:20:00+08:00"/>
</div>

As we can see above, JSON-LD we create a structure independent from the content. But we need write the same information twice. Microdata the advantage is we just need to write the content once but the information is totally markup dependent. Especially for articles, we have two different rich cards, one for pages that support AMP and other for Non-AMP pages.

Search result without AMP

Search result with AMP

After adding this information to your content we need to validate it, for that we use the Structured Data Testing Tool

If you are using WordPress there are many different plugins to use Structure data in your Website: https://wordpress.org/plugins/tags/structured-data/

WordPress 4.7.5 e o que vem por ai com a versão 4.8

Nos últimos dias tivemos vários anuncios importantes referentes ao WordPress 4.8 a nova versão que esta em beta e outros referente a segurança:

Primeiro anuncio a versão 4.8 do WordPress não dara mais suporte as versões 8, 9 , 10 do internet explorer, Matt anunciou em seu blog que o suporte a essas versões está travando o desenvolvimento da plataforma. Todos os fronts comemoram essa decisão.

Ainda sobre a nova versão grandes mudanças foram anunciadas novos recursos para widgets, agora a widget de texto possui  um editor visual por padrão, antes era possível com adição de plugin. Também foram anunciadas três widgets uma de vídeo, audio e imagens.

Core Widgets on Twenty Seventeen

Segundo anuncio, aproveitando o gancho dos últimos incidentes e o grande ataque realizado pelo #wannacry,  o WordPress está engajado na comunidade hackerone. Para quem não conhece hackerone é uma plataforma que os usuários reportam falhas de segurança e recebem bonificações dependendo do nível da falha. Em seu perfil oficial, serão discutidos outros projetos como: BuddyPress, bbPress, GlotPress e WP-CLI. Até o momento 3.700 dolares foram repassados para 7 diferentes reports.

Finalizando, essa semana saiu uma atualização de segurança do WordPress, a versão 4.7.5 ela contém  seis correções de segurança e segundo o WordPress está atualização deve ser  realizada imediatamente. Os updates estão relacionados a nova parceria com o hackerone, são falhas referente a XSS, Cross Site request Forgery e melhorias na XML-RPC API.

Referencias:

WordPress Is Now on HackerOne, Launches Bug Bounties

WordPress 4.7.5 Patches Six Security Issues, Immediate Update Recommended

 

What to Expect in WordPress 4.8

Target Browser Coverage

 

Meetups… Meetups… and Volunteer job

In 2013 I used for the first time meetup.com, I was in San Francisco for me was the best opportunity to visit some companies and practice my listening skills. Because the meetups are organized for companies like Google, Microsoft, Facebook, Github.  But my favorite meetups was the language exchange meetups, was the best experience meet people from different countries, was an opportunity to know I a little about different cultures.

2016 I arrived in Dublin and the platform still useful, but here in Dublin has some differences between San Francisco, the first thing the city are totally different, San Francisco has more Asians students, Dublin is full of Brazilians.

For me, the language exchange doesn’t work like San Francisco, because here in Dulin 90% of the group are Brazilians with a beginner or intermediate level. In San Francisco was common find an American trying to learn: Portuguese, Japanese or Spanish. Here is not common Irish engaged with this kind of event.

If you want to practice your conversation skill, try surf groups, running groups or dancing groups. These groups there are more native speakers than a language exchange group. Volunteer jobs also are a great opportunity to integrate with the local culture.

If you are a developer like me, there are more tips for you; the first some IT events need Volunteer, for example, WordCamps.

You can search for WordCamps next to you here:
https://central.wordcamp.org/schedule/

Social media week it is an event about marketing also is possible work as a volunteer:

Get Involved

One Month ago, I started a new volunteer as a teacher in a Coder Dojo in Dun Laoghaire:

https://zen.coderdojo.com/dojo/ie/dun-laoghaire/digital-dun-laoghaire

Basically, I’m teaching programming for children between 07 and 11 years old. It’s is a great opportunity to be integrated into the local community. There we use Scratch, It’s a drag-and-drop code tool, perfect for teaching children because is so visual.

During the Dojo, the children choose the challenge to code using a guide called sushi card.

http://kata.coderdojo.com/wiki/Scratch_Path

The coder dojo Dun Laoghaire happen every Monday at Starbucks Marine Road (beside Nando’s). For me it’s one the best activities during my week, the children are so nice and have the feeling that I’m contributing to something.

Actually, we need more mentors if you are interested just fill the form to be a volunteer: https://coderdojo.com/volunteer/