Leave web page text manageable

Question

I developed a one-page layout which the client requested that a part of the site be manageable, something that was not in the project at the beginning.

It’s a simple line between <p> and </p>

What’s the easiest way to do that?

PS: I don’t work with PHP

Answer 1

Do with Wordpress can be a bit like putting a tractor where needed a VW, but usually this kind of thing tends to escalate: today is a small text, tomorrow are five texts and some images, and so on.

In Wordpress, give the customer an account with role of Author. Using this account, log in and prepare a post that will be what the client will update. With the plugin Allow hide all that is superfluous for a basic level user.

To pull the content of this specific post in Wordpress, I would recommend the plugin JSON REST API and your favorite PHP or Javascript technique to popular your HTML. With it installed, use the URL http://exemple.com/wp-json/posts/{post-id} with the client post ID to receive a JSON object with the post content.

Here is an example of making an AJAX request to a blog that has the JSON REST API enabled using pure Javascript. To use with jQuery, search here in these search results.

/**
 * Faz chamada AJAX a um blog que tem o REST JSON API ativado
 * - busca por um post determinado ao iniciar
 * - oferece possibilidade de pedir outros IDs
 *
 * Inspirado em http://www.tutorialspoint.com/php/php_and_ajax.htm
 *
 * @param iniciar Boolean Usando para inicio da página ou envio do formulario
 */
function ajaxFunction(iniciar) {
  var ajaxRequest,
      ajaxDisplay = document.getElementById('ajaxDiv');;

  try {
    // Opera 8.0+, Firefox, Safari
    ajaxRequest = new XMLHttpRequest();
  } catch (e) {
    // Internet Explorer Browsers
    try {
      ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e) {
        // Não tem jeito
        alert('Seu browser quebrou!');
        return false;
      }
    }
  }
  // Função que recebe retorno do Ajax
  ajaxRequest.onreadystatechange = function() {
    if (ajaxRequest.readyState == 4) {
      var parsed = JSON.parse(ajaxRequest.responseText);
      // console.log(parsed);
      ajaxDisplay.innerHTML = '<h1>' + parsed.title + '</h1>' + parsed.content;
    }
  }

  if (iniciar) {
    ajaxRequest.open("GET", "http://megane-blog.com/wp-json/posts/1400", true);
    ajaxRequest.send(null);
  } else {
    ajaxDisplay.innerHTML = 'Esperando JSON...';
    // Capturar valor e fazer chamada Ajax
    var post_id = document.getElementById('post-id').value;
    ajaxRequest.open("GET", "http://megane-blog.com/wp-json/posts/" + post_id, true);
    ajaxRequest.send(null);
  }
}

// Roda script ao carregar a página
ajaxFunction(true);

<form name='myForm'>
  Usar estes IDs como teste: 1377, 1366, 1355, 1331:
  <input type='text' id='post-id' />
  <input type='button' onclick='ajaxFunction()' value='Fazer AJAX' />
</form>
<div id='ajaxDiv'>Esperando JSON...</div>

Answer 2

Felipe, no way, you can use a "Ferrari" to solve a simple problem, that would be Wordpress in the similar molds that the brasofilo answered, or you create a very simple own resource, which is the purpose of this my answer.

So I leave here for you to choose the best way. Seeing the comments if you want to use JS, in any case a PHP to persist the data in the database, via AJAX (there are other features for BD recording, but it is not ideal in this case).

I want to give this option to you in two steps:

1. A Jquery plugin for you to be able to edit inline text, that is, on the same screen as you are viewed content:

• Plugin Jeditable - http://www.appelsiini.net/projects/jeditable
• Demo of the plugin: http://www.appelsiini.net/projects/jeditable/default.html

2. It’s no use the above feature if anyone can edit, so I recommend reading below to create a very simple PHP authentication system. In your case, after authenticated, return to the normal site screen, but enabling the editing events through the above plugin. Follow the tutorial:

• Simple tutrial for PHP authentication (there are many others on the internet, I did a little research and found this interesting).

3. PHP files that "will receive AJAX". Respecting and understanding items 1 and 2 you will be able to do this step without problem.

I hope I gave you a valid option for your project. Hugs.