How to Update Your Review to the New Format

toggle-button

These instructions show you how to convert your existing review to the new format.  Instructions for formatting new reviews will be covered in a separate document.

Rather than modifying your existing review page the technique outlined below involves the creation of a new page in a temporary work area. Once you are happy with the new page you can copy and paste the new page into your original review page. The temporary work area can then be deleted or retained as a workspace to convert another review.

The advantage of this approach is that it is fail-safe. Your original review remains online unmodified until you are fully happy to cut it over to the new page in the new format.  It also means you can experiment with the new format without fear of messing up what’s online.

In these instructions the conversion process has been broken into discrete steps.  You don't have to complete all steps at the one time so you can spread the conversion process over several sessions if you wish. Estimated completion times are shown for each step. These times include the time it takes to read the documentation so your second and subsequent conversions should take much less time.

These instructions are lengthy because they have been written for editors with no understanding of HTML. However that length should not be construed to imply the conversion process is complex. It's not; it's actually quite straight forward. Indeed George's version of these instructions that he prepared for HTML honchos takes less than half a page.

Step A.  Create a temporary work area page  (5 minutes)

Step B  Insert a blank template for your review into your work area page (5 minutes)

Step C.  Copy and paste the introduction and discussion into the template (5 minutes)

Step D:  Create the Quick Selection Guide at the end of your review (10 minutes per product)

Step E: Copy the work area page to your live review (5 minutes)

Step F: Tidying up (5 minutes)

Screenshots

 



Step A.  Create a temporary work area page

1.  Open your browser, navigate to your review at  http://www.techsupportalert.com and login.

2.  From the left navigation sidebar select "Create content" and then from the Create content page select "Article."

3.  In the article title box enter "workspace" followed by your username.  In my case this meant entering "workspace-gizmo"    

4. From the pull down "Article Type" list select "Other."  It’s the last entry on the list.

5. We are not yet ready to put anything in the "Article text" box but unfortunately Drupal won’t let you leave it blank. You can  enter anything you like but in these instructions let's assume you entered "Hello world" in this field.


6.  Skip down to "Comment settings" and click it to expand the menu. From the expanded menu click the "Disabled" button to turn comments off.  

7.  Skip down to "In moderation queue" and uncheck the box. 

Unchecking this box eliminates the need for you to approve the creation of your new work page.  However any changes you make to your work page once created still subject to revision control. 

This means you need to approve each set of changes each time you edit your work space page.  You approve changes to your work page by "reverting" the latest revision to be the current revision, in exactly the same manner as you normally approve updates to review page.

In these instructions you will be making and saving several sets of changes to your work page so don't forget to approve each set of changes after you save the page.

8. Click the "Save" button at the bottom of the page to complete the creation of your temporary work page.  The address of your page will be: http://www.techsupportalert.com/content/workspace-xxxxx.htm where xxxxx  is your username.

In my case my work page is called http://www.techsupportalert.com/content/workspace-gizmo.htm

You have now completed the creation of your temporary work page.

Step  B  Insert a blank template for your review into your work page.

1. Open your work page in your browser and click the "Edit" tab

2. Skip down to the Article text box.  Click the "Source" button in the toolbar. It’s the first button in the top left.
You should now see the html code for the page looking something like this:
 


 
3.  Click anywhere inside the Article text box.  Use Ctrl A to select everything in the box then hit the <Delete> to delete the entire contents of the box.

4.  Select the HTML code below and copy it to the clipboard by using Ctrl C (Note: You can also create this template code with George's script.)

<!-- START: Select all the lines below this line up to and including the END marker -->


<div>&nbsp;</div>
<!-- #### BEGIN: Quick Link #### -->
<table class="review">
    <tbody>
        <tr>
            <td class="review-title">
            <div class="review-title">In a Hurry?</div>
            </td>
        </tr>
        <tr>
            <td>
               <img align="absbottom" alt="" src="/files/images/icons/review/icon_2rightarrow.png" />&nbsp;&nbsp;Go straight to the <a href="#Quick_Selection_Guide">Quick _fcksavedurl="#Quick_Selection_Guide">Quick _fcksavedurl="#Quick_Selection_Guide">Quick Selection Guide</a>
            </td>
        </tr>
    </tbody>
</table>
<!-- #### END: Quick Link #### -->
<!-- #### BEGIN: Introduction #### -->
<table class="review">
   <tbody>
   <tr>
      <td class="review-title">
         <div class="review-title">
            Introduction
         </div>
      </td>
   </tr>
   <tr>
      <td>
         Here goes your introductory text...
      </td>
   </tr>
   </tbody>
</table>
<!-- #### END: Introduction #### -->
<!-- #### BEGIN: Discussion #### -->
<table class="review">
   <tbody>
   <tr>
      <td class="review-title">
         <div class="review-title">
            Discussion
         </div>
      </td>
   </tr>
   <tr>
      <td>
         Here goes your discussion text...
      </td>
   </tr>
   </tbody>
</table>
<!-- #### END: Discussion #### -->
<!-- #### BEGIN: Related #### -->
<table class="review">
   <tbody>
   <tr>
      <td class="review-title">
         <div class="review-title">
            Related Products and Links
         </div>
      </td>
   </tr>
   <tr>
      <td>
         List related products and links here if you like. Otherwise delete this section...
      </td>
   </tr>
   </tbody>
</table>
<!-- #### END: Related #### -->
<!-- #### BEGIN: Details #### -->
<table class="review">
   <tbody>
   <tr>
      <td class="review-title">
         <div class="review-title">
            <a name="Quick_Selection_Guide"></a>Quick Selection Guide
         </div>
      </td>
   </tr>
   <!-- #### BEGIN: Details of product XY #### -->
   <tr>
      <td>
         Insert a table row for each product here (remove/replace the row with this text). Create each row with the <a href="http://www.urltrim.com/create-details.php" target="_blank">create-details.php</a> script...
      </td>
   </tr>
   <!-- #### END: Details of product XY #### -->
   </tbody>
</table>
<!-- #### END: Details #### -->




5.  Paste the html code into the Article text box by clicking anywhere inside the box and pressing Ctrl V.    The Article text box should now look like this:



6. Skip to the bottom of the page and press the "Save" button.  Your work page now has George’s template inserted and should look like the shot below. If so, you have now completed this step.

template

Step C.  Copy and paste the introduction and discussion into the template


1.  Open in a browser tab your work area page containing the blank template. Click the "Edit" tab.  We are now going to copy and paste text from your old review into the blank template using the WYSIWYG editor. There is no need to deal with HTML code in this step.

2. In a separate tab open your existing review. There is no need to go into edit mode as we can copy text from the viewed page directly.

3. Select the introduction text from your old review. Just highlight the text body and excluding any headings. Copy the selecting text to the clipboard using Ctrl C.




4. Move to your other browser tab containing your work area page in edit mode. In the Article text box select the phrase that reads "Here goes the introductory text …" Make sure you also select the three dots on the end and also make sure you don’t select anything other than the text.



5.  Replace the selected text by pasting from the clipboard using Ctrl V. (If the paste doesn’t work go to the other browser tab containing your old review and press Ctrl C again. Then return to the template and press Ctrl V)



6.  Go to the other browser tab containing your old review and highlight the text containing discussion about the recommended software products.  If there are screen shots in that text them copy them along with text.  Select only the product discussion text; do not select any introductory text and do not select any of the product details from the end of the old review.



7.  Move to your other browser tab containing your work area page in edit mode. In the Article text box select the phrase that reads "Here goes the discussion text …" Make sure you also select the three dots on the end and also make sure you don’t select anything other than the text.



8.  Replace the selected text by pasting from the clipboard using Ctrl V. (If the paste doesn’t work go to the other browser tab containing your old review and press Ctrl C. Then return to the template and press Ctrl V)



9.  Skip to the bottom of the edit page and press the "Save" button to save your page. You work area page should now be looking pretty good.  If your page looks something like the shot below you have successfully completed this step.



Step D:  Create the Quick Selection Guide at the end of your review

This step is the trickiest part of the whole process as you have to locate the exact position in your review page HTML code where you must paste the html code for each software item.

The good news is you don’t have to write any HTML code; George’s script does that for you.

The bad news is that you need to be very clerically accurate where you insert the code.  If you get it wrong by just one line you could mess up your whole page.

Thankfully George has made this easier by inserting place markers in his code to guide you. So don’t be too daunted; just carefully follow the instruction below and you will be fine.

Georges’ script only works with one software product at a time so if you have three products mentioned in your review you will need to repeat the process outlined below three times.

1.   Open your work area page in a browser tab. Click the "Edit" tab.  Click the "Source" icon in the Article text toolbar.  (The "Source" icon is the first icon in the toolbar at the top left)

In the Article text box you should now see displayed the HTML source code for your work area page.



2. Open your original review in a browser tab. Locate the first product mentioned in the review and click on it. This should take you to the product details for that item at the end of your original review.  We will now copy and paste these details into George’s script.

You will also need to paste the name of the anchor (bookmark) for that product into the script.  To locate the name of the anchor look at the address in your browser address window and note the name that follows the # at the end of the address. That’s the name of the anchor for this product.

So by way of example, if the address in your browser address bar looks like this:

http://www.techsupportalert.com/best-free-rootkit-scanner-remover.htm#pan

Then the anchor name for this product is pan. (You drop the "#")

3. Open a new tab in your browser. From that tab navigate to George’s PHP script which is located at: http://www.urltrim.com/create-details.php

You now need to fill in all the fields in the product table.  Mostly you can do this by just copying and pasting from your old review but some fields such as the product Pros and Cons will need to be written afresh.  Here’s an example of a completed table:



Click the "Create" to create the html code which you will paste into your work page. Below the table you will then see the html code generated by the script for this item.



Click anywhere in the table containing the generated code and hit Ctrl A to select all the code. Now hit Ctrl C to copy the code to the clipboard.

4.  Now the tricky bit; we need to copy the generated code and paste it into your work area page.

Go to the browser tab that you opened in step (1) containing your work area page in html edit mode.

Click anywhere in the box containing the HTML code and scroll to the bottom of the code.

Look for the line that reads "<!-- #### BEGIN: Details of product XY #### -->"

Position your curser at the beginning of this line and hit <Enter> to insert a blank line

Move your curser up one line to the beginning of the blank line you inserted. This is where we are going to paste the code generated by George’s script.



Now hit Ctrl V to insert the code you copied to the clipboard in step (3) above.

Scroll to the bottom of the screen and press the "Preview" button.  Scroll to the bottom of your review to the Quick Selection Guide and you should see you first software item inserted and nicely formatted like this:



If everything looks fine then go to the bottom of the preview screen and click "Save" to save your work.

If your page looks all wrong then hit your browser back button to cancel the editing changes and start again from step (1).

If all went well you now need to repeat this procedure for each product in the review. Once you have entered all your products you are ready to move on to the next step.


Step E: Copy the work area page to your live review

If you have reached this stage then all the hard work has been done so you can breathe a sigh of relief.  Now we just have to move your masterpiece from the work area to your actual review. We will do this by copying and pasting the HTML code from one to the other.

1.   Open your work area page in a browser tab. Click the "Edit" tab.  Click the "Source" icon in the Article text toolbar.  (The "Source" icon is the first icon in the toolbar at the top left)

In the Article text box you should now see displayed the HTML source code for your work area page. Click anywhere inside the box containing the HTML code and type Ctrl A to select all the code then Ctrl C to copy it to the clipboard

2. Open your original review in a browser tab. Click the "Edit" tab.  Click the "Source" icon in the Article text toolbar.  (The "Source" icon is the first icon in the toolbar at the top left). Click anywhere inside the box containing the HTML code and type Ctrl A to select all the code then Ctrl V to replace it with the contents on the clipboard.

Scroll to the bottom of the page and click "Save" to save you changes.

That’s it; your newly formatted review should now be online.

Step F: Tidying up

Check out your new page looks to see if any fine tuning is needed. Here are some things to look out for:

1. At the end of the Quick Selection Guide you’ll see a paragraph that reads:
 

"Insert a table row for each product here (remove/replace the row with this text). Create each row with the create-details.php script..."

Edit the page and delete the unwanted paragraph.

2.  Check for unnecessary blank lines and delete as necessary

3. Copy and paste the "Related Items" section (if any) into your new review. If your review doesn't have any related items you can delete the heading.

4. Copy and paste the editor acknowledgement paragraph into your new review

5. If your original review didn’t have any products screenshots then now is the time to create then and insert them into your review.

Screenshots

Screenshot 200pxIf you want use screenshots in your review please follow these rules. The screenshots in your review body should be thumbnails 200 pixels wide in GIF or JPG format. Please create the screenshot image files in that size first before you upload them.

If you like to provide a bigger screenshot as well to show more details, create a second larger version of the image, 500 pixels wide and upload it as well. You can then link your 200px screenshot to the larger version. Full details how to do this can be found here: http://www.techsupportalert.com/upload-images

 

6. After saving your changes remember to "revert" your latest revision to make it the current page.

7. Finally write to the vendor who you awarded the "Gizmo's Top Pick" award telling them they have received this best-in-category award.  This is very important to our site because it will generate traffic to us from the vendor's site.

You'll find full instructions plus a sample letter you can copy and paste here:

http://www.techsupportalert.com/award-logo.htm

 

Gizmo
December 2008.

 

Please rate this article: 

Your rating: None
0
No votes yet