Gallery card text

NeilWebber

Hi again, I've had a good look round but can't find an answer to this question. I'm likely to be missing something obvious as usual.

When adding an item to a gallery card (e.g. an app from WAB) the main label on the card defaults to the name of the object being added and I can't see an option to change it independently.  Is it possible to use an alias for this instead?

I ask because I name my apps/maps and so on according to a convention that allows me to keep track of versions etc. Those names are not exactly useful as a gallery headings but I don't really want to change them at source to make them so. Any thoughts on the alias thing, or any other method to achieve similar are gratefully received.

with thanks, Neil

KlaraSchmitt

Unfortunately, it is not presently possible to edit individual items in our Gallery Card as that is a dynamic card that updates automatically based on the parameters you set, so you would have to change the name of the item at the root object, which I recognize you do not want to do.

The only other solution I can see is that instead of using our Gallery Card, you could make your own cards using HTML and our Text Card, which would allow you to change the item name to whatever you want and you'd simply need to link to the Hub item yourself.

I will provide the basic code for a card - styling will be handled automatically, but you may want to adjust the Boostrap grid classes in the div wrapping the card depending on how many cards you want to show in a row. The code I will provide assumes 3 cards in a row on laptops, 2 cards per row on tablets, and 1 card per row on mobile. If you want 4 cards in a row on laptop instead, switch col-md-4 to col-md-3.

<div class="col-xs-12 col-sm-6 col-md-4">
   <div class="calcite-web">
      <div class="card-base">
         <div class="card-image-wrap">
            <img class="card-image" src="http://esri.github.io/calcite-web/assets/img/docs/bridge3.jpg" alt="Bridge Club, 1954">
            <div class="card-image-caption">
               Florida, January 1954
            </div>
         </div>
         <div class="card-content">
            <h4><a href="#">Card with Image</a></h4>
            <p>Cards can have full-bleed images with optional captions.</p>
            <a href="" class="btn btn-default">View Examples</a>
         </div>
      </div>
   </div>
</div>