Wordpress subpages


I have been asked to design a site in Wordpress .Just a rough design looks like given below :

<img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/9ewrq.png" data-original="https://i.stack.imgur.com/9ewrq.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />

so what i want is when i click on <strong>ABOUT</strong> it should expand and display the page content.Somewhat like this :

<img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/LicUd.png" data-original="https://i.stack.imgur.com/LicUd.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />

Any one has any idea regarding displaying the page content at same place instead opening in new page or window ?

Thanks in advance.. :)


the below is the php code of page.php

<?php get_header(); ?> <div id="content" class="page"> <div id="box"> <h3><?php the_title(); ?></h3> <?php if (have_posts()) : ?> <?php while (have_posts()) : the_post(); ?> <div class="post" id="post-<?php the_ID(); ?>"> <?php the_content(); ?><br /><div style="clear:both;"></div> </div> <?php endwhile; ?> <?php endif; ?>

i want menus to be displayed as shown in the images .So as per the tutorial of <strong>Arconix Shortcode Collection</strong> it says i have to write the code as for example

[accordions] [accordion title="About"] About Content here [/accordion] [accordion title="Results"] Results Content here [/accordion] [accordion title="People" last="last"] People Content here [/accordion] [/accordions]

Now in this instead of just the content watever we write i wanted it to be

1)content from a page for example in case of about its the content from page <strong>About</strong>(as pages can be created in wordpress Pages--->new page .So in case if i want to edit this i just go to pages and edit the about page).

2)and the content should get displayed only after mouse click..

<strong>edit 2</strong>

In the pages wherever I want to include <strong>accordion</strong> i select the given option from the pages

<img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/xeSRD.png" data-original="https://i.stack.imgur.com/xeSRD.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />

once i click on it .There is no option to select a page as shown below:

so anyone has any idea regarding this..?

<img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/aCSHy.png" data-original="https://i.stack.imgur.com/aCSHy.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />


There is a WordPress plugin that can accomplish this easily - <a href="http://wordpress.org/extend/plugins/arconix-shortcodes/" rel="nofollow">http://wordpress.org/extend/plugins/arconix-shortcodes/</a>

Documentation for Accordions with this plugin at <a href="https://arconixpc.fogbugz.com/default.asp?W4" rel="nofollow">https://arconixpc.fogbugz.com/default.asp?W4</a>

(The plugin does much more as well.)


  • how to redirect the link to other page rather then default in wordpress
  • Wordpress: query_posts - how to show multiple posts
  • Wordpress Sum meta_values from posts and order them per category
  • Escape character
  • Wordpress category sort by date
  • ACF fields not showing on a wordpress custom taxonomy page
  • Trying to get random array value to echo on element class
  • Values from custom meta boxes being repeated in posts
  • How can I order by a variable in this PHP code?
  • Wordpress -how to return just current month posts on archive.php
  • wordpress custom page template
  • wp-query category and has tag
  • font-face not showing up on Firefox
  • Use Greasemonkey to remove table
  • AngularJS error injector modulerr
  • How can I have equal heights for inner elements of flexbox grid/boxes/cards without using jQuery?
  • Ajax calls do not work in IE unless you fiddle with security settings
  • Keep this build forever option - Jenkins
  • FileReader+canvas image loading problem
  • Insert into database using onclick function
  • Deselecting radio buttons while keeping the View Model in synch
  • Why HTML5 Canvas with a larger size stretch a drawn line?
  • How to show dropdown in excel using jrxml (jasper api)?
  • Cannot Parse HTML Data Using Android / JSOUP
  • How to delete a row from a dynamic generate table using jquery?
  • Windows forms listbox.selecteditem displaying “System.Data.DataRowView” instead of actual value
  • json Serialization in asp
  • Rails 2: use form_for to build a form covering multiple objects of the same class
  • Free memory of cv::Mat loaded using FileStorage API
  • Memory offsets in inline assembly
  • Java static initializers and reflection
  • How to stop GridView from loading again when I press back button?
  • Turn off referential integrity in Derby? is it possible?
  • unknown Exception android
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Unable to use reactive element in my shiny app
  • Conditional In-Line CSS for IE and Others?
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize