Scroll To Top

Enter a query to search our site. Note that you can use "*" and "?" as wildcards. Enclosing more than one word in double quotes ("CSS Layout") will search for the exact phrase.


Version 3.2.5

Added Show/Hide Accordion Toggle Bar with Hamburger icon for Smartphones. Also fixed minor white-space issue when using the widget in mouse-over mode

Do you need the update?

You only need to update If your current version is less then 3.2.3. To be certain, open Extension Manager and check your version number.

Downloading the updated version

To download the latest version, go to our customer service download center:

PVII Download Center

Follow the instructions to find your order or to have your order history sent to you. Once you locate your order, you will have access to the download.

Installation for Users of Previous Versions

  1. Unzip your download
  2. Install the extension using the Extension Manager
  3. When prompted to overwrite existing files or replace your existing version, choose Yes or Yes To All
  4. Restart Dreamweaver to complete the update process
  5. Locate the p7ap3 folder and delete the p7AP3scripts.js file inside
  6. Select your widget and open the interface as if you were going to edit the menu
  7. Make no changes. Simply click OK
  8. The system will create a new p7PM3scripts.js file
  9. Upload the new script file to your server

If you are creating your Accordion in a new folder, that's it. You are done. If you are updating an existing Accordion, you need to modify the existing CSS file. Open the relevant APM3 CSS file. For example, the file for Theme 01 would be p7AP3-01.css. Scroll to the bottom and create a new line. Paste the following code into the new line:

Note that the selector prefix .p7AP3-01 used in most of the rules, relates to theme 01. If you are using theme 02, please change the selector to .p7AP3-02. If you are using another theme, use its number.

.p7AP3-01.responsive .ap3-toolbar {
display: none;

@media only screen and (min-width: 0px) and (max-width: 700px) {
.p7AP3-01.responsive .ap3-toolbar {
display: block;
background-color: #222;
padding: 5px 10px;
text-align: right;
cursor: pointer;
.p7AP3-01.responsive .ap3-toolbar a {
font-size: 2em;
font-weight: bold;
color: #999;
text-decoration: none;
.p7AP3-01.responsive .ap3-toolbar a:hover {
color: #FFF;
.responsive .toggle-text a:before {
position: relative;
top: -.25em;
.p7AP3-01.responsive .toggle-text.closed a:before {
content: "Show Menu \0020";
font-size: .5em;
.p7AP3-01.responsive .toggle-text.opened a:before {
content: "Hide Menu \0020";
font-size: .5em;
.p7AP3root-wrapper.closed {
height: 0px;
.p7AP3root-wrapper.opened {
height: auto;
overflow: hidden;


Prior Updates

24-April-2014: version 3.2.2

Fixed incorrect text case on image file names in Style Theme 01

For example, the image name in the CSS file was:
background-image: url(img/p7AP3_page_black.gif);

it should be:
background-image: url(img/p7ap3_page_black.gif);   

23-October-2013: version 3.2.1

CSS edit to work around small bug in Firefox and Chrome. The clearing element now uses a non-breaking space instead of a period. This eliminates a small area of white space at the bottom of the widget. The white space is only noticeable in themes that have an outer border. All new deployments you make will include the revised CSS. If you are working in an existing folder, with an existing APM3 style sheet, you can perform the edit yourself. Locate this rule:

.p7AP3:after {
content: ".";
font-size: 0px;
display: inline;
overflow: hidden;
line-height: 1;

Change the value in the first property to "\0020":

.p7AP3:after {
content: "\0020";
font-size: 0px;
display: inline;
overflow: hidden;
line-height: 1;

31-July-2013: version 3.2.0

Fixed UI error when complex html markup is inside the trigger <a> tags.

18-June-2013: Added ZXP installer format

ZXP installer now included for compatibility with Dreamweaver CC. Simply re-download your product and you will find a ZXP file that will enable you to install your product into Dreamweaver CC.

24-March-2013: version 3.1.9

Fixed an issue when there are more than 10 nested APM3 widgets.

26-February-2013: version 3.1.8

Updated the APM3 Columns CSS file to adjust the media query for smartphones. To update previously created widgets:

/*1 Column for Narrow Browser Windows and Smartphones in both orientations*/
@media only screen and (min-width: 0px) and (max-width: 700px) {

11-Feb-2013: version 3.1.7

Updated the APM3 script to fix display issues when nesting other widgets or galleries inside hidden panels when animation was set to none.

09-Jan-2013: version 3.1.6

Added new style theme (21-Splash). See Related tutorial...

29-Dec-2012: version 3.1.5

Fixed script error when using image-based triggers. Added viewport <meta> tag if needed on page. The meta tag instructs mobile devices to honor their actual viewport size, which makes it easier to employ responsive design techniques. The meta tag will only be added if absent. If your page already contains a viewport meta tag, it will not be replaced.