• Suppose i have written 10-one line summary of the topics at the start of the page and their description at the bottom, now whenever someone click on the topic it will go to the topic description placed below but without reload. We can usually observe this thing on many of the websites.

Viewing 1 replies (of 1 total)
  • This can be achieved using some JavaScript but there are a number of steps.

    The WordPress post text editor will strip out any JavaScript because malicious JavaScript could be inserted. The codex tells us: “JavaScript cannot be added to post content without a special WordPress Plugin that removes the filters that prevent unwanted code within the post content area, for the protection of the user.” If all your editors are trusted, or if there is only you, proceed.

    To enable JavaScript in posts you will need to use a plugin. This one worked for me:
    https://www.ads-software.com/plugins/easy-code-placement/

    In my example, my page has a topic called “Financing” which is a long way down the page.

    Go to Admin page > Settings > Easy Code Placement and setup a new shortcode. I called mine GotoFinance. The shortcode to be inserted is:
    [ecp code=”GotoFinance”]
    The code for the shortcode is:

    <input type=button" value="Financing" class="button" onclick="location='#financing';">

    Next, go to the page and put the new shortcode at the top.

    Lastly you need to define the anchor. Go down the page to the Financing topic and find the title. Give this tag the id defined in the shortcode:

    <h3 id="financing">Financing</h3>

    Element ids must be unique on any one page.

    You will need to do this once for each topic.

    I have assumed your site uses HTML5. The use of anchor tags in HTML4x is a little different.

Viewing 1 replies (of 1 total)
  • The topic ‘go to the topic on click in same page without reload’ is closed to new replies.