contentpopup
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision | Next revision Both sides next revision | ||
|
contentpopup [2015/03/11 22:18] christopher |
contentpopup [2017/06/27 20:00] brittany [I would like a Contact Us button instead of a text hyperlink] |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ====== Inserting popup contact form links into your content ====== | ||
| - | If you want to insert a link to a popup contact form, you will need to add a specific line of code to your page's source code. The contact widget will not work for internal Real Geeks websites as it is designed to only work for external sites. | ||
| - | |||
| - | First you will need to open up the page that you wish to add the contact form to. | ||
| - | |||
| - | Once the page is open, locate the edit source button in the edit box. | ||
| - | |||
| - | {{:editsource01.png|}} | ||
| - | |||
| - | This will launch the raw code of the page. Locate the position where you want to insert the code and add the following: | ||
| - | |||
| - | <code html> | ||
| - | <a class="popup" href="/member/contact/">Contact Us</a> | ||
| - | </code> | ||
| - | |||
| - | This will generate a text only hyperlink to the Contact form, which will pop up on top of the existing page. | ||
| - | |||
| - | {{:contactform01.png|}} | ||
| - | |||
| - | =====I would like a "Contact Us" button instead of a text hyperlink===== | ||
| - | |||
| - | This can be performed by adding an <img src> code into the code block. | ||
| - | |||
| - | You will first need an image to use as a button. Feel free to use this button we are using as an example or create/locate one of your own. | ||
| - | |||
| - | {{::contact.png|}} | ||
| - | |||
| - | Upload the image to your [[uploading|File Browser]] and take note of the filepath URL. | ||
| - | |||
| - | You will then replace the "Contact Us" text with the code linking to the image, which will look like this: | ||
| - | |||
| - | <code html> | ||
| - | <img src="http://u.realgeeks.media/YOURSITENAME/FILENAME.png"> | ||
| - | </code> | ||
| - | |||
| - | Make sure everything is copied verbatim for the image's filepath including: | ||
| - | |||
| - | * The proper site name so the correct File Browser is accessed | ||
| - | * File name of the image | ||
| - | * The image's file extension (*.png, *.jpg, etc.) | ||
| - | |||
| - | The entire code block that would look like this: | ||
| - | |||
| - | <code html> | ||
| - | <a class="popup" href="/member/contact/"> | ||
| - | <img src="http://u.realgeeks.media/YOURSITENAME/FILENAME.png"> | ||
| - | </a> | ||
| - | </code> | ||
| - | |||
| - | This will insert your specified button on to the page, linking to the same pop up contact form. | ||
contentpopup.txt ยท Last modified: 2020/05/28 19:28 by michaels
Page Tools
