Admin Navigation Links buttons?

Solved
Highlighted
Excursionist
30 2 2

On Shopify dev documentation on app extension, the screenshot showing buttons on the right beside the links.

I could not find anything in the admin app extension to create those buttons.

I'd like to add an external link this way. Was this feature dropped?  

 

Thank you for any input or documentation links I may have missed.

0 Likes
Highlighted
Shopify Staff
Shopify Staff
120 15 19

Hey @chenster 

I think this is what you are looking for.

Kevin_A | Developer Support @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution 

0 Likes
Highlighted
Excursionist
30 2 2

I've tried that, but it didn't show up. I'd like to have the button always visible like a 'Help' button that opens a link to app help page. Could it be specific to Shopify theme?

0 Likes
Highlighted
Shopify Staff
Shopify Staff
120 15 19

Hey @chenster 

Can you link me the partners dash URL for the app you are working on?

Kevin_A | Developer Support @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution 

0 Likes
Highlighted
Excursionist
30 2 2
Highlighted
Excursionist
30 2 2

Hi @Kevin_A 

I submitted the app an hour ago. 

First, it's rejected (Review reference 23212) with explanation (possible by automated testing)

  1. App must install successfully.
    Your app does not request installation on the shop immediately after clicking "add app". Apps must ask a shop for access when being installed on a shop for the first time, as well as when they are being reinstalled after having been removed. During install or reinstall we expected Oauth to be initiated at https://appstoretest5.myshopify.com/admin/oauth/request_grant but was redirected to https://appstoretest5.myshopify.com/admin/charges/4573298744/request_recurring_application_charge

However, 10 min later, I got another Shopify email says that it is now under review. Then I checked the app status, it is still "Under Review".  

Can I safely ignore the first app reject email?

 

 

0 Likes
Highlighted
Shopify Staff
Shopify Staff
120 15 19

Hey @chenster 

Maybe I am misunderstanding but it appears you already have 2 links setup in your app:
20-08-nz3bj-vfbdc

Kevin_A | Developer Support @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution 

0 Likes
Highlighted
Excursionist
30 2 2

Actually, I just want o to have a button like this to the right side of the navigation bar that visible all time. Personal Discount app has this button. 

chenster_1-1597868918856.png

I've tried Admin links but it doesn't show up anywhere. 

Richard

0 Likes
Highlighted
Excursionist
30 2 2

I figure it out. It's AppBridge options

https://www.shopify.com/partners/blog/75776707-how-to-make-the-most-of-the-shopify-embedded-app-sdk

Go to the "Buttons" section.

 

<script type="text/javascript">
  ShopifyApp.ready(function() {
    ShopifyApp.Bar.initialize({
      title: '<%= title %>',
      icon: '/images/logo.png',
      buttons: {
        primary: {
          label: "Save",
          message: 'bar_save'
        },
        secondary: [
          // Dropdown example
          {
            label: "More",
            type: "dropdown",
            links: [
              // Link Button that opens in the app
              {
                label: "Update",
                href: "/update",
                target: "app"
              },
              // Button with a callback function
              {
                label: "Delete",
                callback: function() {
                  alert("destroy")
                }
              }
            ]
          },
          {
            // Link Button that opens in a new window
            label: "Preview",
            href: 'http://<%= shop %>.myshopify.com',
            target: "new"
          },
          {
            label: "Open Modal",
            callback: function() {
              ShopifyApp.Modal.open({
                src: 'http://localhost:3000/modal_content',
                title: 'A new modal',
                width: 'small',
                height: 300,
                buttons: {
                  primary: {
                    label: "OK"
                  },
                  secondary: [{
                    label: "Cancel",
                    callback: function(label) {
                      ShopifyApp.Modal.close();
                    }
                  }]
                }
              });
            }
          }
        ]
      }
    });
    ShopifyApp.Bar.loadingOff();
  });
</script>

 

THIS IS AN EXCELLENT RESOURCE.

For example, the Authentication section talked about using javascript window.top.location.href to ensure doing the redirect in the parent window, not in the iframe to get around X-Frame-Options=DENY. X-Frame-Options=DENY that Many developers had the same issue. 

0 Likes
Highlighted
Excursionist
30 2 2

This is an accepted solution.

The previous post of a solution is still using the old SDK that is deprecated. 

Here's the new recommended AppBridge documentation doing the same thing.  

https://shopify.dev/tools/app-bridge/actions/titlebar

0 Likes