User Tools

Site Tools


uploading_your_logo

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
Last revision Both sides next revision
uploading_your_logo [2019/06/06 22:04]
brittany [Using Pixlr X]
uploading_your_logo [2019/06/07 23:16]
brittany [Adding Logo to Footer]
Line 1: Line 1:
 This doc details how to upload your logo to your website from the backend as well as how to crop or resize your image using Pixlr Express. ​ This doc details how to upload your logo to your website from the backend as well as how to crop or resize your image using Pixlr Express. ​
  
-=====Using Pixlr X=====+=====Resizing Image with Pixlr X=====
  
 Navigate to https://​pixlr.com/​x/​ to use this free tool.  Navigate to https://​pixlr.com/​x/​ to use this free tool. 
Line 27: Line 27:
  
  
-If you’d like to crop out part of your image, scroll past this section and navigate to **Cropping** Your Image. 
- 
- 
-=====Resizing your image===== 
- 
-To resize your image, go back to "​Adjustment"​. 
- 
-{{::​3_-_do.png?​400|}} 
- 
-Click **Resize**. ​ 
- 
-This will open a box with dimensions you can edit to fit your Real Geeks site. Please keep your image within the following dimensions for best display on your website: 
- 
- 
-Width: 200 x Height: 43 
-Or 
-Width: 400  x Height: 86 
- 
-{{::​5_-_do.png?​400|}} 
- 
-Change the numbers to adjust the size of your logo and click **Apply**. 
- 
-Once you click **Apply**, your image will become smaller. ​ 
- 
-{{::​6_-_do.png?​400|}} 
- 
-Make sure to click **Save** in the top left-hand corner to save the image and download to your computer. 
- 
-{{::​7.png?​400|}} 
- 
-After you click **Save**, type in the name you want for your new file and select Save again. 
- 
-{{::​8.png?​300|}} 
- 
-Select where you want to save your new logo on your computer and click **Save**. 
-  
-If you want to use this resized logo on your website, scroll past this next section about cropping and go straight to **Uploading** to your website. 
  
 =====Cropping Your Image===== =====Cropping Your Image=====
  
-To crop your image, ​go back to **Adjustment** and select ​**Crop**.+To crop your image, select ​the square cropping symbol and change the height to a smaller number. Then click Apply.
  
  
-{{::3_-_do.png?400|}}+{{::pxlrx5.jpg?700|}}
  
 +When you are done editing your logo, click **Save**.
  
-This will open the cropping tool over your image as seen below.+{{::pixler6.jpg?700|}}
  
-{{::​9.png?​400|}} 
  
-Use the cropping tool to crop the parts of the image you want removed. You can see the example below of cropping out the Real Geeks professor.+Select ​the JPG option and click **Download**. You will then find the logo in your downloads folder.
  
 +=====Uploading to Your Website=====
  
-{{::​10.png?​400|}}+====Adding Logo to Top of Site====
  
 +To add your logo to the top left of your site, go to your site backend and scroll down to **Site Settings**.
  
-Once you’ve selected the area you want to remove, click the **Apply** button on the bottom toolbar. This will successfully crop your logo.+{{::​logorar1.jpg?500|}}
  
 +Go to the **Template Options** tab and scroll down to **Header Logo**. Click **Pick Image**.
  
-After cropping your image, select **Save** in the top left-hand corner to save the image and download to your computer.+{{::​logorar2.jpg?700|}}
  
  
-{{::11.png?700|}}+Find your logo and click **Insert**.
  
 +{{::​logorar3.jpg?​500|}}
  
-After you click **Save**, type in the name you want for your new file and select **Save** again.+====Adding Logo to Footer====
  
- 
-{{::​12.png?​300|}} 
- 
- 
-Select where you want to save your new logo on your computer and click **Save**. 
- 
-=====Uploading to Your Website===== 
 Navigate to the backend of your website to get started. You'll see the site administration backend menu as seen below. Go to the **Content** subsection on this page and click **Footers**. ​ Navigate to the backend of your website to get started. You'll see the site administration backend menu as seen below. Go to the **Content** subsection on this page and click **Footers**. ​
  
  
-{{::13.png?400|}} +{{::13.png?600|}} 
  
  
Line 110: Line 70:
  
  
-{{::15.png?200|}}+{{::15.png?250|}}
  
  
Line 118: Line 78:
  
  
-{{::16.png?400|}}+{{::16.png?700|}}
  
  
Line 124: Line 84:
  
  
-{{::17.png?400|}}+{{::17.png?600|}}
  
  
Line 130: Line 90:
  
  
-{{::18.png?400|}}+{{::18.png?700|}}
  
  
Line 136: Line 96:
  
  
-{{::19.png?400|}}+{{::19.png?500|}}
  
  
Line 144: Line 104:
  
  
-{{::20.png?400|}}+{{::20.png?700|}}
  
  
Line 150: Line 110:
  
  
-{{::21.png?400|}}+{{::21.png?700|}}
  
  
Line 156: Line 116:
  
  
-{{::22.png?400|}}+{{::22.png?500|}}
  
  
Line 162: Line 122:
  
  
-{{::23.png?400|}}+{{::23.png?700|}}
  
  
Line 168: Line 128:
  
  
-{{::24.png?400|}}+{{::24.png?700|}}
  
  
Line 174: Line 134:
  
  
-{{::25.png?400|}}+{{::25.png?700|}}
  
  
Line 180: Line 140:
  
  
-{{::26.png?400|}}+{{::26.png?700|}}
  
  
 Congratulations! You’ve successfully edited and uploaded your logo to your website. Congratulations! You’ve successfully edited and uploaded your logo to your website.
  
uploading_your_logo.txt · Last modified: 2020/05/28 19:26 by michaels