1

I'm looking for a way to share (automated way) my WordPress entry on another of my self programmed website. In other words: I'd like to embed a specific WordPress article into my website (coded in Angular).

Any ideas on how to do this?

closed as off-topic by Michael, Krzysiek Dróżdż, Nathan Johnson, Mark Kaplun, Jack Johansson Apr 5 '18 at 14:34

This question appears to be off-topic. The users who voted to close gave this specific reason:

If this question can be reworded to fit the rules in the help center, please edit the question.

  • 2
    Depends on how you want to embed it. One way is oEmbed, see make.wordpress.org/core/2015/10/28/… for an example. – swissspidy Apr 3 '18 at 20:30
  • Is this an article on the same site that has an Angular frontend? Or a 3rd party? WP posts can be embedded via OEmbed – Tom J Nowell Apr 4 '18 at 0:35
  • you can scrap your site. you can reed from RSS you can use oembed, you can use rest api. As it is now the question is so broad it is practically useless. You should edit it and be much more specific about the context in which you want to do it. – Mark Kaplun Apr 5 '18 at 5:30
3

do you try the Wordpress REST Api? It is an easy way to add content from your Wordpress Site to an other website.

EDIT:

After the comment form Mark Kaplun, i edited my answer and add a small example of “how to use the Wordpress REST API”.

The base path of the API is always "/wp-json/wp/v2/" and it returns an JSON string.

Example url:

https://wptavern.com/wp-json/wp/v2/

To get the data for an specific post, you can use for instance the slug or the post id.

Example post:

https://wptavern.com/an-update-to-my-gutenberg-experience

Call the REST API with the slug:

https://wptavern.com/wp-json/wp/v2/posts?slug=an-update-to-my-gutenberg-experience

Call the REST API with the post id:

https://wptavern.com/wp-json/wp/v2/posts/79564

i created this small code example with jquery and not with angularjs, because i haven't any experience with this js framework. Sry.

<!DOCTYPE html>
<html>
   <head>

    <script src="https://code.jquery.com/jquery-3.3.1.min.js"
          integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
          crossorigin="anonymous"></script>

    <style>
        body {
          background: white;
          font-family: Helvetica;
        }

        #post-title {
          border: 1px solid green;
          padding: 5px;
        }

        #post-content {
          border: 1px solid blue;
          padding: 5px;
        }

        #post-link {
          border: 1px solid red;
          padding: 5px;
        }
    </style>

    <script>

        $( document ).ready(function() {

            $.ajax({
                type: 'GET',
                url: "https://wptavern.com/wp-json/wp/v2/posts/79564", 
                dataType: 'json',
                success: function(json)
                {
                    $('#post-title').html(json.title.rendered);

                    $('#post-content').html(json.content.rendered);

                    $('#post-link').html(json.link);

                }
          });

        });

    </script> 

</head>

<body>

    <div>POST Title</div>
    <div id="post-title"> </div>

    <div>POST Content</div>
    <div id="post-content"></div>

    <div>POST Link</div>
    <div id="post-link"></div>

</body>

see the code in action: https://jsfiddle.net/5zqc3mdL/11/

  • 1
    this answer just doen't have any real content :( all it does it lets the reader know that there is such a thing as REST API, but how to use it for what the OP wants? – Mark Kaplun Apr 5 '18 at 5:27

Not the answer you're looking for? Browse other questions tagged or ask your own question.