'Next Article' with Blog post

One of my clients asked me to add a 'next Article' and the 'Previous item' buttons for the blog. The concept is if a person reads a blog post (the current don't post not a list of posts) when they come at the end of the article, they can click on the two buttons. A single button they will be for the next most recent post (if the position is the most recent, then this button is not visible) or they can click on a button to be taken to the previous post (by date).

To my knowledge there is no way to do this by using the tags or out-of-the-box modules. My question is has anyone at - it an any idea javascript which may be able to produce what I would do?

All ideas are welcome.

Note: I can manually to add to every post, but I'm looking for a way to have automated it.

I finally found a solution that works. It requires some knowledge of HTML/javascript, but I'll post the example that I use with commented code. There may be better ways to do this, but this is the best I came up with that.

First we need to create a blank page that will list all the blog post and the data we want to. On this page, you can insert this code:

    {"module_blogpostlist, 12345, 1000, template="/settings/blog-list.tpl "}

The module above could be broken down like this:

{module_blogpostlist, BLOG ID, NUMBER OF POSTS, path to THE CUSTOM MODEL}

In other words, we use the module blogpostlist for a certain blog (BLOG ID) then we list all of the blog post. I put it to a very high number, I want all the blog post on a single page. Can I set a custom template for the layout vs the default layout.

Note: Remember in your head to this page, you need to:

It's so this page does not appear in the results of the research.

Now that we have the page layout to set the custom template that we use to list the information that we need. Open a code editor, add the following code, and then save them in a .tpl file.

  • {tag_itemurl_nolink}

    {tag_blogposttitle_nolink}

    • To break down each line:

    Line 1: This is the Blog Post Id of each blog post.

    Line 2: This is the URL of the blog.

    Line 3: This is the title of the Blog post without a link.

    Once the above files are created and uploaded, it is time to add the code for the blog itself.

    Open up the layout of the Blog Post details:

    • Admin console: Site manager > Module models > Blog layouts
    • SFTP & develop Mode: /Layouts/Blog/post.html

    First, he must insert where we want the buttons next and previous to appear. I add the following code:


    Basically, I'm floating each div to the left or right, then clear the float with a break. All this is in my CSS. The important part is the class of next and prev will be used for the button that will make the link to the respective message.

    Now for the Javascript. I have add this below all the rest of the presentation of details of Post of Blog. I commented on each line of javascript in order to see what I'm doing. This method assumes that you use jQuery, that this has been tested with jQuery version 2.1.1.

    If (nextLength > 0) {//If statement is so we do not show a 'Next Post' button when there is not a next post.

    Insert HTML for the next Post. Can be changed to match your site code.

    $(«.next») .html (")

    Next Post

    « + nextTitle + »') ;

    }

    If (prevLength > 0) {//If statement is so we do not show a previous 'Post' button when it does not have a previous post.}

    Insert HTML for the previous Post.  Can be changed to match your site code.

    $(«.prev») .html (")

    Previous post

    ' (+ prevTitle + ');

    }

    });

    });

    Now you have a Next and Previous Post buttons.

    Hope this helps others.

    -Lynda

    Tags: Business Catalyst

    Similar Questions

    • Simple blog post

      I am trying to add asinglre blog post to a web page outside the blog page

      It should look like this.

      "

      Blog title lorem ipsum

      Blog post text lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum

      Lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsumlorem ipsum lorem ipsum

      Lorem ipsumlorem ipsum lorem ipsumlorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum

      Lorem ipsum lorem ipsum...

      Continue reading

      "

      and wen of the person click continue readfing it redirects to the blog post on the blog page.

      How is that possible?

      is there any tag who does that and who works next to the blog page?

      Ok! Well, do as I suggested: create a category called recommended and mark desired feature. Then you export all the blogs by category and select feature. If you do not problems with the blog layout, simply create a personal template .tpl for this case. This is how we usually solve this problem.

    • How to play the next song with the repetition of the same song over and over again

      How to play the next song with the repetition of the same song over and over again.

      In this screenshot, shot an Apple article, you can see four icons at the bottom of the screen. Look at the third argument of the right, with the two arrows going in a circle. It's the repeat function. When turned on, you can tap the icon to turn it off.

    • View all blog posts in the main list

      Hello world

      I'm not very familiar with BC, so I'm having a bit of trouble getting my head around the anatomy of the it.

      Basically, what is happening here is that there are 15 blog posts in total, but post on the main page of the blog, only 10. I can't seem to find where I can change how it is displayed, can someone point me in the right direction?

      Thanks for any input.

      In the overall layout of blog:
      Overall layout of blog | Developers of business catalyst

      After the tag list, the setting for a number of positions.

    • Import/export of blog posts

      I intend to host my blog with square space and I was wondering if anyone has had experience with export of British Colombia blog posts to the square space?

      Here's what the square space says about this: the import content of Tumblr - help


      If this is not the case, what are my options? I have to do it manually? How will this affect my SEO?

      probably they running RS power that will be in a specific way for the options to import it it lists. BC is not one of those, so you can't run this automated tool.

      If they have no method of the API or standard RSS feed importing tool outside these options you can only do it manually.

    • How to fix BC blog post meta < title > and < description >

      BC-blog < title > and < description > shows (seo) list of the bar side/post - but does not show in the post through site menu NAV page.

      The blog post title and description appear corectelly when you click on the sidebar of the post list.

      It must use the module layout list.html, which I set up with:

      < html >

      < head >

      < title > {tag_blogpostmetatitle} < /title >

      < meta content = "description" name = "{tag_blogpostmetadescription}" >

      < / head >

      < body >

      On the bar side/post list

      Title and Description show correctly here:

      https://cameocoinsonline.worldsecuresystems.com/cameo-coins-blog/how-to-buy-and-sell-gold-et-Argent-lingots

      The problem is:

      When you click the menu nav to 'blog', it does not show correct title and description.

      Since the blog through nav menu page

      Title and Description are not correctly here:

      It shows the name of the blog (blog of cameo parts) instead of the name for the post.

      https://cameocoinsonline.worldsecuresystems.com/cameo-coins-blog

      Please notify

      Thank you

      Oh, ok.

      If you don't put in a title and which is empty then it will return on behalf of blog. Even with products on electronic commerce. Don't put in a product title and it will display the name of the catalog.

    • Blog post details - module CSS

      I inserted a blog in a customers Web site and there is a random horizontal rule appears.  Now, I wouldn't mind that, except that its been blocked my text.  I have not really dug / got familiar with all that is in the modulestylesheets and was wondering if anyone knows where and how I can go to control this.

      Problem: http://www.screencast.com/t/zyPmPF67fd

      Real location: http://www.visionquestdallas.com/BlogRetrieve.aspx?BlogID=14162

      Clues are appreciated!

      Thank you very much.

      Hey there,

      Best option is to change this:

      .blog-post h2.post-title {   border-bottom: 1px solid #ccc;   font-size: 18px;   margin: 0;   padding: 0 0 3px; }

      To do this:

      .blog-post h2.post-title {   border-bottom: 1px solid #ccc;   font-size: 18px;  padding: 0 0 3px; }

      It has a margin in there it's ruin, which take off and he comes straight

    • Problem with the post OFFICE when using HttpsConnection

      Hello community,

      my scenario:

      I have a piece of code that runs on a BB and a Servlet located on a Tomcat 6.0.18. The code on the BB uses POST to send data. When you use with HTTP POST, everything works like a charm, but I have trouble with the POST and HTTPS.

      It seems that the data is not transferred from BB on the server. The use of the debugger I discovered that the data is written to the output stream (side), but when the servlet calls getParameter() only null is returned.

      To ensure a correct installation, I tried a GET with HTTPS which works very well.

      The given code example is on the side of the unit

      connection = Connector.open(url);

HttpsConnection https = (HttpsConnection)connection;

https.setRequestMethod(HttpsConnection.POST);

https.setRequestProperty(HEADER_CONTENTTYPE, CONTENTTYPE_FORMDATA);

https.setRequestProperty(HEADER_CONTENTTYPE, String.valueOf(length));

out = https.openOutputStream();out.write(PostMessage.getBytes());

in = https.openInputStream();

ResponseMessage = new byte[(int)https.getLength()];

in.read(ResponseMessage);

out.close();in.close();https.close();

      Any help is very appreciated!

      Thanks in advance.

      PS:

      Simulator: 8300

      MDS: 4.1.4

      JDE: 4.5.0

      Eclipse: Version: 3.4.1
      Build id: M20080911-1700

      Dear community,

      I managed to solve the problem by myself. Its a classic copy & paste error.

      Lets take a look at:

      https.setRequestProperty(HEADER_CONTENTTYPE, CONTENTTYPE_FORMDATA);

https.setRequestProperty(HEADER_CONTENTTYPE, String.valueOf(length));

      As you can see I used two times HEADER_CONTENTTYPE. Its not so bad, but to indicate the length of a post, you need to use HEADER_CONTENTLENGTH:-D.

      I have to take a break...

      You can consider the issue as resolved.

    • URL of the object, with a post

      Hello

      I was wondering if anyone has tried to use the URL of the object?

      It seems pretty simple, but for some reason, the remote server always answer me as if my post was empty.

      I tried with a loop, and it works perfectly with my post.

      So the problem must be with my code, but I also noticed that the URL of the object in the API, the method Explorer postContent, it says that I should pass a string value.

      But if I take the workflow of post HTTP, its passage to a string value, so I'm confused.

      Also, I use vRO 7.0

      Here's the code I developed:

      var urlObject = new URL (url + user + "& _secret =" + password);

      If (os.toLowerCase () == 'sles') {}

      var folder_os = linux/unix/Assembly"."

      } ElseIf (os.toLowerCase () == "windows") {}

      var folder_os = "windows/windows 2012/Assembly."

      } else {}

      throw ("OS not supported");

      }

      var content = '{\"attributes\': {' +}

      '\"ipaddress\":\ '. "" "full domain name +"\"},\"hostname\":\." "" "" servername + "\" +. "

      ', \"folder\":\ '. "' + folder_os + ' \ '}"; "

      System.log ("URL:" + url + user + "& _secret =" + password);

      System.log ("PostContent:" + content);

      result = urlObject.postContent (content);

      System.log (result);

      Hello

      You must set the requestType ('POST') and the contentType (' application/json') properties of your URL object before calling the postContent() method.

    • development module when I change something with correction of the area I can't move to the next image with the right arrow key

      Hello

      I work with the module development and when I change something with correction of the area I can't move to the next image with the right arrow.

      Is there a solution?

      Norbert

      I think that Yes you are talking about "Spot healing.

      So once you have used the tool, please click "Fertig" at the bottom right of the image.

      Try, and then use the arrow keys.

    • Blog post content lost paragraph breaks

      Hello

      I encounter a weird problem that I can't figure out yet. I added some blog posts and in the content of post window they show up as expected and tagged correctly (Fig. 1). However, when I find the post in the blog, everything is put together (fig. 2). Any thoughts on why this might happen? It was like that before I even did something extra style on the blog site. Any help is greatly appreciated.

      FIG. 1

      Screen Shot 2015-08-19 at 11.49.06 PM.png

      FIG. 2

      Screen Shot 2015-08-20 at 12.10.47 AM.png

      I thought about it.  Commenting out margin: 0; of the class p in my global.css fixed.

      body, div, dl, dt, dd, ul, ol, li, nav, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, entry, butto n, textarea, p, blockquote, th, td, one

      {

      / * margin: 0; * /

      padding: 0;

      border-width: 0;

      -webkit-transform-origin: left top;

      -ms-transform-origin: left top;

      -o-transform-origin: left top;

      Transform-origin: left top;

    • dynamically fill a webapp with blog tags

      Hello, is it possible fill a webapp with blog tags dynamically?

      So basically, each element webapp name would be the name of tag, that's all,

      Thank you

      Not that I know, but you can make a blog with some webapps, this video will give the basics. Mike Sallander - Blog Web App

      It may be useful

    • I did a blog in adobe muse and his now adjust it in British Colombia, but I can't seem to change the date format of blog post?

      I did a blog in adobe muse and his now adjust it in British Colombia, but I can't seem to change the date format of blog post?

      My ideal date format would be / 28, Oct 2015

      can anyone help? I don't know that I can handle the {tag_postdate}

      You can use something like this in the post or poster list: {tag_blogpostday}, {tag_blogpostmonth}, {tag_blogpostyear}

    • Display the first paragraph of the blog post using liquid

      The legacy tag {tag_blogpostbodypreview, text} to preview the blog. There is no similar opportunity in new liquid markup except for the | truncate the filter. This thing is very dangerous but if you insert the code, tags are clipped then before being closed it can destroy the whole layout of a page. Grab a table for

      example or a tag is truncated in the middle. How can I have only my first paragraph or a short teaser projected in a blog post list? Any help would be appreciated!


      P.S. in the markup of liquid there is a | filter truncatewords, but this one seems not to be included in the liquid BC still?

      Dennis

      It's a bad idea because it will remove all the images and formatting you want to keep your content.

      Original labels will be and always work in your page layouts. If you want to preview the first paragraph just continue to use the tag

      There are several filters to liquid does not not in British Colombia, do not know if they apply at the present time. BC were on the front just like they did the migration.

    • How can we prevent that you can drag to the next article?

      Hello

      I create a folio for a show.

      The goal is that customers can choose from a menu which they would like to see "presentation/article. Then when the article is at an end he should go back to the menu at the beginning.

      But now, when you're at the end of an article and you swipe left you automatically go to the next article.

      So my question is: Y at - it a way to put a 'stop' at the end of an article, so that the people can not slide further and so they have no choice but to go back or click on the home button?

      Thank you very much!!

      My solution for a simililar scenario was to create a whole page, 2-State mute MSO to play the slide show once. Then the home button (or the navigation buttons) were available on tap, while the page itself resisted all moves.

    Maybe you are looking for