moved Query Para details to its own section (SharePoint#966)

Linda-Editor · VesaJuvonen · commit c2c712ff856f · 2017-10-20T09:39:35.000-04:00
diff --git a/docs/spfx/extensions/get-started/building-simple-field-customizer.md b/docs/spfx/extensions/get-started/building-simple-field-customizer.md
@@ -65,7 +65,7 @@ This article describes how to create your first Field Customizer Extension. You
     code .
     ```
     
-    **Note:** Because the SharePoint client-side solution is HTML/TypeScript based, you can use any code editor that supports client-side development to build your extension.
+    > **Note:** Because the SharePoint client-side solution is HTML/TypeScript based, you can use any code editor that supports client-side development to build your extension.
 
     Note how the default solution structure looks like the solution structure of client-side web parts. This is the basic SharePoint Framework solution structure, with similar configuration options across all solution types.
 
@@ -143,7 +143,7 @@ You cannot currently use the local workbench to test SharePoint Framework Extens
     
     ![Creating a new list](../../../images/ext-field-create-new-list.png)
     
-5. Create a new list named **Orders** and then select **Create**.
+5. Create a new list named **Orders**, and then select **Create**.
     
     ![Creating a new list with name of Orders](../../../images/ext-field-create-new-list-order.png)
     
@@ -161,34 +161,38 @@ You cannot currently use the local workbench to test SharePoint Framework Extens
 
     Because our Field Customizer is still hosted in localhost and is running, we can use specific debug query parameters to execute the code in the newly created list.
 
-9. Append the following query string parameters to the URL. Notice that you will need to update the ID to match your own extension identifier available from the **HelloWorldFieldCustomizer.manifest.json** file.
+9. Append the following query string parameters to the URL. Notice that you will need to update the ID to match your own extension identifier available from the **HelloWorldFieldCustomizer.manifest.json** file. For more information, see [More details about the URL query parameters](#more-details-about-the-url-query-parameters). 
 
     ```
     ?loadSPFX=true&debugManifestsFile=https://localhost:4321/temp/manifests.js&fieldCustomizers={"Percent":{"id":"45a1d299-990d-4917-ba62-7cb67158be16","properties":{"sampleText":"Hello!"}}}
     ```
 
-More detail about the URL query parameters:
 
-- **loadSPFX=true** ensures that the SharePoint Framework is loaded on the page. For performance reasons, the framework is not normally loaded unless at least one extension is registered. Because no components are registered yet, we must explicitly load the framework.
-- **debugManifestsFile** specifies that you want to load SPFx components that are locally served. The loader only looks for components in the App Catalog (for your deployed solution) and the SharePoint manifest server (for the system libraries).
-- **fieldCustomizers** indicates which fields in your list should have their rendering controlled by the Field Customizer. The ID parameter specifies the GUID of the extension that should be used to control the rendering of the field. The properties parameter is an optional text string containing a JSON object that will be deserialized into `this.properties` for your extension.
-  - **Key**: Use the internal name of the field as the key.
-  - **Id**: The GUID of the Field Customizer extension associated with this field.
-  - **Properties**: The property values defined in the extension. In this example, `sampleText` is a property defined by the extension.
-
-The full URL should look similar to the following, depending on your tenant URL and the ___location of the newly created list:
+    The full URL should look similar to the following, depending on your tenant URL and the ___location of the newly created list:
     
-```
-contoso.sharepoint.com/Lists/Orders/AllItems.aspx?loadSPFX=true&debugManifestsFile=https://localhost:4321/temp/manifests.js&fieldCustomizers={"Percent":{"id":"45a1d299-990d-4917-ba62-7cb67158be16","properties":{"sampleText":"Hello!"}}}
-```
+    ```
+    contoso.sharepoint.com/Lists/Orders/AllItems.aspx?loadSPFX=true&debugManifestsFile=https://localhost:4321/temp/manifests.js&fieldCustomizers={"Percent":{"id":"45a1d299-990d-4917-ba62-7cb67158be16","properties":{"sampleText":"Hello!"}}}
+    ```
     
-Accept the loading of Debug Manifests by selecting **Load debug scripts** when prompted.
+10. Accept the loading of debug manifests by selecting **Load debug scripts** when prompted.
+
+    ![Accept loading debug scripts](../../../images/ext-field-accept-debug-scripts.png)
+
+    Notice how the Percent values are now presented with an additional prefix string as `Hello!: `, which is provided as a property for the Field Customizer.
 
-![Accept loading debug scripts](../../../images/ext-field-accept-debug-scripts.png)
+    ![List view with field customizer rendered for percent field](../../../images/ext-field-default-customizer-output.png)
 
-Notice how the Percent values are now presented with an additional prefix string as 'Hello!: ', which is provided as a property for the Field Customizer.
 
-![List view with field customizer rendered for percent field](../../../images/ext-field-default-customizer-output.png)
+### More details about the URL query parameters
+
+- **loadSPFX=true** ensures that the SharePoint Framework is loaded on the page. For performance reasons, the framework is not normally loaded unless at least one extension is registered. Because no components are registered yet, we must explicitly load the framework.
+- **debugManifestsFile** specifies that you want to load SPFx components that are locally served. The loader only looks for components in the App Catalog (for your deployed solution) and the SharePoint manifest server (for the system libraries).
+- **fieldCustomizers** indicates which fields in your list should have their rendering controlled by the Field Customizer. The ID parameter specifies the GUID of the extension that should be used to control the rendering of the field. The properties parameter is an optional text string containing a JSON object that will be deserialized into `this.properties` for your extension.
+    - **Key**: Use the internal name of the field as the key.
+    - **Id**: The GUID of the Field Customizer extension associated with this field.
+    - **Properties**: The property values defined in the extension. In this example, `sampleText` is a property defined by the extension.
+
+<br/>
 
 ## Enhance the Field Customizer rendering
 Now that we have successfully tested the out-of-the-box starting point of the Field Customizer, let's modify the logic slightly to have a more polished rendering of the field value. 
@@ -246,7 +250,7 @@ Now that we have tested our solution properly in debug mode, we can package this
 1. Install the solution package to the site where it should be installed, so that the extension manifest is white listed for execution.
 
 2. Associate the Field Customizer to an existing field in the site. You can do this programmatically (CSOM/REST) or by using the feature framework inside of the SharePoint Framework solution package. You'll need to associate the following properties in the `SPField` object at the site or list level.
-    - **ClientSiteComponentId** is the identifier (GUID) of the Field Customizer, which has been installed in the App Catalog. 
+    - **ClientSiteComponentId** is the identifier (GUID) of the Field Customizer, which has been installed in the App Catalog.
     - **ClientSideComponentProperties** is an optional parameter, which can be used to provide properties for the Field Customizer instance.
 
     Note that you can control the requirement to add a solution containing your extension to the site by using the `skipFeatureDeployment` setting in **package-solution.json**. Even though you would not require the solution to be installed on the site, you'd need to associate **ClientSideComponentId** to specific objects for the extension to be visible.
@@ -258,7 +262,9 @@ Now that we have tested our solution properly in debug mode, we can package this
 4. Extend the **sharepoint** folder and **assets** subfolder in the root of the solution to see the existing **elements.xml** file. 
     
     ![assets folder in solution structure](../../../images/ext-field-assets-folder.png)
-    
+
+<br/>
+
 ### Review the elements.xml file 
 
 Open the **elements.xml** file inside the **sharepoint\assets** folder.
@@ -282,6 +288,8 @@ Note the following XML structure in **elements.xml**.  The **ClientSideComponent
 </Elements>
 ```
 
+<br/>
+
 ### Ensure that definitions are taken into account within the build pipeline
 
 Open **package-solution.json** from the **config** folder. The **package-solution.json** file defines the package metadata as shown in the following code:
@@ -385,6 +393,4 @@ Now you are ready to deploy the solution to a SharePoint site and get the field
 
 In this case, we continued to host the JavaScript from the localhost, but you could just as well relocate the assets to any CDN and update the URL to enable the loading of the JavaScript assets outside of the localhost as well.
 
-The process for publishing your app is identical among the different extension types. You can use the following publishing steps to update the assets to be hosted from a CDN.
-
-* [Host extension from Office 365 CDN](./hosting-extension-from-office365-cdn.md).
+The process for publishing your app is identical among the different extension types. You can use the following publishing steps to update the assets to be hosted from a CDN: [Host extension from Office 365 CDN](./hosting-extension-from-office365-cdn.md).
