====== 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.