Scroll to the bottom of this article and download the attached files.


Portals

A Portal is a specially designed website that serves as the point of access for online retail sales. Multiple portals can be created, depending on your company and customer needs. In this section we will be duplicating a portal, and making the necessary adjustments to create a B2B online storefront.

Portal View

Next, click on the name of the duplicated portal {Charcoal Studio - copy}. This will open up the portal view.

Download the file below to complete the next steps.


Click on {Customize this Portal} at the bottom of the Portal general section.

Homepage HTML

The Charcoal Studio portal utilizes an image slider at the top of the page. The code for these images can be found in the Homepage HTML section in lines 15, 21, and 27. In order to update these images, you will need to upload your images to DocketManager. W2P Image hosting instructions can be found below.

W2P Image - Image Slider

Open the CRM Menu and navigate to Sample Customer

  • Click on the {+} next to Files
  • Upload the file named imageslider-bc.png
  • For File Group choose W2P Image
  • Click on Save
  • Right click on the name of the file and click Copy Link Address
  • The link will be copied to the clipboard
  • Navigate to Settings > Online Configuration > Online Ordering > Portals > Charcoal Studio - copy > Homepage HTML
  • Scroll down to Code Line 15
  • Highlight the following text: https://support.docketmanager.net/portals/paper-studio/slider1.jpg
  • Press Control + V to paste the copied W2p Image link
  • Click Save


View Your Work

Navigate to Settings > Online Configuration > Online Ordering > Portals > Charcoal Studio - copy > {URL Link} to view the new image on your Portal.

Featured Products

Below the Image Slider are the Featured Product Images and links. These links can point directly to a Product or to a Product Catalog.

 


Product #1

Code Line 56

  • The image link is displayed in blue after <img src=
  • Upload the image named drinkware.jpg at the Customer level, copy the link, and update the html.
  • Change the text Apparel to Drinkware


Code Line 56

  • The link is displayed in blue after "<a href=" and the text Apparel is in black.
  • Once you have Products built in your Portal you can navigate to the Product that you want to link to and copy and paste the link from the address bar.
  • For now let's just update the word Apparel to "Drinkware".


Code Line 61

  • The link is displayed in blue after: <a href= and the text View Now is in black.
  • Once you have Products built in your Portal you can navigate to the Product that you want to link to and copy and paste the link from the address bar.
  • For now this line can be left as is.


Product #2

The same adjustments that were made for Product #1 can be made to Product #2 in lines 70, 73, and 75.

Upload the image named business-card1.jpg at the Customer level, copy the link, and update the html.

In line 73 change the text Stamps & Seals to Business Cards.


Product #3

Code Lines 84, 87, and 89 are connected to Product #3. These lines can be left alone at this time.

These lines act just like Product 1 and 2 and can be updated at anytime in the same way.



Back to W2P Training Menu