PVII Mobile Friendly Tables User GuideThe Ultimate Responsive and Adaptive Tools for Dreamweaver
What do you do when your client calls at 4:00pm and says "Hey dude, when I search for my site on a phone, Google can't find it. It's not there, man! I called an SEO guy and he says he thinks it's because I have tables in my pages." Instead of a panic attack, followed by hours of coding, you can use PVII Mobile-Friendly Tables to convert old-fashioned tables into mobile-friendly tables, in no time.
Install the extensions
Mobile-Friendly Tables comes with an Extension Installer in two formats:
- p7_MFT_102.mxp
- p7_MFT_102.zxp
Extension installer files come in 2 formats: MXP and ZXP. MXPs are supported by Extension Manager versions MX, MX2004, 8, CS3, CS4, CS5, CS5.5 and CS6. ZXP is supported by versions CS6 and higher. Version CC and higher have dropped support for the MXP format. To continue to support all Adobe customers, regardless of version, we include both the classic MXP and the new ZXP versions.
For version CS5.5 and older:
Open your Extension Manager and choose the Install command located in the header or in the file menu. Browse to the installer file p7_MFT_102.mxp in the root of the zip archive you downloaded and install it.
For Creative Cloud versions:
Open your CC Extension Manager and choose the Install command located in the header or in the file menu. Browse to the installer file p7_MFT_102.zxp in the root of the zip archive you downloaded and install it.
Tip: If you get an error message when installing, it probably means that you do not have the correct version of Extension Manager installed. Adobe does not automate this process for you anymore. You need to log into the Adobe Cloud and then download and install the Extension Manager that matches your version of Dreamweaver.
Work in a defined Dreamweaver site
Before you begin, make sure you are working inside a defined Dreamweaver web site. This is necessary so that Dreamweaver knows how to link required assets. If you are new to Dreamweaver or need to learn how to define a web site, follow these simple steps:
Choose Site > New Site
Specify local site location
The Site category of the Site Setup dialog box is the only one you need to fill out to begin working on your Dreamweaver site. This category lets you specify the local folder where you’ll store all of your site files. When you’re ready, you can fill out the other categories in the Site Setup dialog box, including the Servers category, where you can specify a remote folder on your remote server.
Site Name
The name that appears in the Files panel and in the Manage Sites dialog box; it does not appear in the browser.
Local Site Folder
The name of the folder on your local disk where you store site files, templates, and library items. Create a folder on your hard disk or click the folder icon to browse to the folder. When Dreamweaver resolves site root-relative links, it does so relative to this folder.
Using PVII Mobile-Friendly Tables
Mobile-Friendly Tables (MFT) is an automated Dreamweaver widget that will convert your existing html tables to render properly on phones, allowing your pages to pass Google's mobile-friendly test. Your pages will no longer be penalized in Google searches done from a mobile phone.
Making a New Mobile-Friendly Tables conversion
-Click inside an existing table on your page, or, if your want to convert all of the tables on your page, click anywhere on your page.
-Click the MFT icon 
in the PVII Section of Dreamweaver's Insert Bar/Insert Panel or choose Insert > Studio VII > Mobile-Friendly Tables by PVII.
Classic Dreamweaver Insert Bar
Note: Some newer versions of Dreamweaver will only able to display icons in shades of gray, rather than in color. Dreamweaver CC does away with the Insert Bar but the programmers left a back door, which is explained in this tutorial.
Dreamweaver Insert Panel
The Mobile-Friendly Tables interface will open.
If you clicked inside an existing table then the Currently Selected Table option will be selected, otherwise the All Tables on Page option will be selected. You can change this option as you like.
Asset Folders
The system creates an assets folder named p7mft at the same level as the page on which you have used MFT. This folder will contain the MFT style sheet file.
When you publish your site, make sure you upload the entire p7mft folder.
Modifying an Existing MFT conversion
After converting a table, you can modify it at any time.
-Click inside an existing table on your page, or, if your want to affect all of the tables on your page, click anywhere on your page.
-Click the MFT icon in the PVII Section of Dreamweaver's Insert Bar/Panel
The MFT UI will open with the currently selected table MFT conversion options.
Configure your options and then click OK.
Managing the User Interface Items
This section covers the options, settings, and entries in the MFT interface.
Apply To: All Tables on the Page
The MFT conversion will be applied to all of the tables on the page.
Apply to: Currently Selected Table
The MFT conversion will be applied only to the currently selected table.
Non-Mobile Presentation
In addition to a mobile-friendly conversion, the MFT system can also make existing tables behave in a flexible manner so that they will adapt in a flexible responsive page.
Make Tables Flexible
Check this option box if you want the table(s) to behave in a flexible manner on desktop/laptop screens.
Make Images Scalable
Check this option if you want the images inside of your table cells to be scalable and behave in a flexible manner as the table cells change in size. This option will affect both the non-mobile and mobile presentations.
Mobile Conversion Type
Choose the conversion type that best fits the structure and data content of your table(s).
Normal Mobile Conversion
Choose this conversion method for most tables. The table will be linearized for mobile presentation. All table cells will be presented in a stacked, vertical fashion. This is the conversion choice to use when the table is used for content layout.
Example 1: Make your browser window narrow to see how the table converts
Table column 1Lorem ipsum dolor sit amet, ne sea vocent scripta abhorreant, facilisi explicari mel ne, ut quo vide ridens. Mei ex quodsi inciderint, quo ad quas deleniti definitionem, vis no wisi graecis offendit. |
Table column 2Lorem ipsum dolor sit amet, ne sea vocent scripta abhorreant, facilisi explicari mel ne, ut quo vide ridens. Mei ex quodsi inciderint, quo ad quas deleniti definitionem, vis no wisi graecis offendit. Lorem ipsum dolor sit amet, ne sea vocent scripta abhorreant, facilisi explicari mel ne, ut quo vide ridens. Mei ex quodsi inciderint, quo ad quas deleniti definitionem, vis no wisi graecis offendit. |
| Footer | |
Example 2: Make your browser window narrow to see how the table converts
 Make my day... |
 Time waits for no man... |
 Get it in gear... |
 Kibble, please... |
 Tusk, tusk... |
 Teddy? |
Data Table Pivot Conversion
If your table contains a header that describes data, then choose this conversion method. The header cells and data cells will be linearized in a logical, readable fashion.
Header
The header and data cells are treated differently. Select the location of the table header:
Top Row
Left Column
Both Left and Top {Left Column + Top Row)
Example 1: Left Column Header
Make your browser window narrow to see how the table converts
| Shoes | Men | Women | Boys | Girls | Pets |
|---|---|---|---|---|---|
| Pants | Men | Women | Boys | Girls | Pets |
| Shirts | Men | Women | Boys | Girls | Pets |
| Coats | Men | Women | Boys | Girls | Pets |
Example 2: Left Column Header and Top Row Header
Make your browser window narrow to see how the table converts
| Month | Savings | Expenses |
|---|---|---|
| January | $1000 | $940 |
| February | $2300 | $1956 |
| March | $3000 | $3100 |
Remove
Click the Remove button to remove the MFT conversion from your page. Either the currently selected table, or all of the tables on your page, will be affected depending on your selection in the Apply To option.
What will be Removed
The system will completely remove the html markup for the selected MFT table, or all of the tables, depending on your selection in the Apply To option, from your page. If there are no remaining MFT converted tables on your page, the system will also remove the link to the MFT style sheet link.
What will Not be Removed
The system will not remove the p7mft folder, which contains the MFT style sheet file. This ensures that you will not lose any assets you may have modified and any other pages that depend on those modified assets will continue to look and behave as expected.
Support
See our main support page for contact information. PVII support never ends.