How add a Promoted links web-part to SharePoint 2013 app default page

This article helps you to add Promoted links web part to your default app page as the following figure:

To do this follow the following steps:

1. Open the shortcut menu for the project, and then choose Add, New Item
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
2. In the Templates pane, choose the List template, and then choose the Add button :
   
   
3. Enter list name and choose the Create a non-customizable list based on an existing list type of option button, and then, in its list, choose Promoted links, and then choose the Finish button
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
4. In Solution Explorer, under the list instance node, open the Elements.xml file. Add the promoted links items as the following:
   
   
    
   <?xml version="1.0" encoding="utf-8"?>
   <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
     <ListInstance Title="MyPromotedLinks"
                   OnQuickLaunch="TRUE"
                   TemplateType="170"
                   FeatureId="192efa95-e50c-475e-87ab-361cede5dd7f"
                   Url="Lists/MyPromotedLinks"
                   Description="My List Instance">
       <Data>
         <Rows>
           <Row>
             <Field Name="Title">Twitter</Field>
             <Field Name="BackgroundImageLocation">/PromotedLinksApp/Images/twitter.png</Field>
             <Field Name="Description">Muawiyah Shannak Twitter</Field>
             <Field Name="LinkLocation" >https://twitter.com/MuShannak</Field>
             <Field Name="Order">1</Field>
           </Row>
           <Row>
             <Field Name="Title">Blog</Field>
             <Field Name="BackgroundImageLocation">/PromotedLinksApp/Images/blogger.png</Field>
             <Field Name="Description">Muawiyah Shannak Blog</Field>
             <Field Name="LinkLocation" >http://mushannak.blogspot.com</Field>
             <Field Name="Order">1</Field>
           </Row>
           <Row>
             <Field Name="Title">Linkedin</Field>
             <Field Name="BackgroundImageLocation">/PromotedLinksApp/Images/linkedin.png</Field>
             <Field Name="Description">Muawiyah Shannak Linkedin</Field>
             <Field Name="LinkLocation" >http://ae.linkedin.com/in/shannak</Field>
             <Field Name="Order">1</Field>
           </Row>
         </Rows>
       </Data>
     </ListInstance>
   </Elements>
   
   
5. In Solution Explorer, under the Pages node, open the Default.aspx file. Add following tags inside the PlaceHolderMain Place Holder:
   
   
   
    <WebPartPages:WebPartZone ID="WebPartZone" runat="server" FrameType="None">
               <WebPartPages:XsltListViewWebPart ID="XsltListViewAppPromotedList"

                   runat="server" ListUrl="Lists/MyPromotedLinks" IsIncluded="True"

                   NoDefaultStyle="TRUE" Title="Images used in switcher"

                   PageType="PAGE_NORMALVIEW" Default="False"

                   ViewContentTypeId="0x">

               </WebPartPages:XsltListViewWebPart>

          </WebPartPages:WebPartZone>




6. Deploy a solution and you will find nice promoted links web part in the app default page!
   
   
   
   Download the sample: http://code.msdn.microsoft.com/office/Sharepoint-2013-How-to-add-e2966a24