primo-explore-clickable-logo-to-any-link
v1.1.9
Published
ExLibris Primo New UI plugin for creating a clickable logo that goes to any configurable URL
Downloads
10
Keywords
Readme
primo-explore-clickable-logo-to-any-link
Description
The library's logo in the top bar becomes a clickable link to a specified URL.
Installation
Assuming you've installed and are using primo-explore-devenv.
Navigate to your template/central package root directory. For example:
cd primo-explore/custom/MY_VIEW_ID
If you do not already have a package.json file in this directory, create one:
npm init -y
Install this package:
npm install primo-explore-clickable-logo-to-any-link --save-dev
Usage
Once installed, inject clickableLogoToAnyLink
as a dependency:
let app = angular.module('viewCustom', ['clickableLogoToAnyLink'])
Note: If you're using the --browserify build option, you will need to first import the module with:
import 'primo-explore-clickable-logo-to-any-link';
You'll need to configure the module by passing it an array of objects as an angular constant
:
| name | type | usage |
|------|-------------|--------|
| url
| string | the url that the clickable link will open |
| altText
| string | for the aria label and alt tag |
| iconLink
| string | replace the icon with a custom URL |
Translations
You can use translations to access back office text by wrapping the value in curly braces, e.g. {nui.header.logoAlt}
. Anything that works in the primo templates link this <span translate="nui.header.logoAlt"></span>
will work if it's available in the current scope.
Example
app.constant('clickableLogoLinkConfig', {
url: '{urls.library}',
altText: '{nui.header.logoAlt}',
iconLink: 'http://cdn.library.myinstitution.edu/icon.svg'
});
// Alternately...
app.constant('clickableLogoLinkConfig', {
url: 'http://library.myinstitution.edu',
altText: 'My Institution',
iconLink: 'http://cdn.library.myinstitution.edu/icon.svg'
});
Acknowledgements
Thanks to https://github.com/Alliance-PCJWG/primo-explore-clickable-logo for the idea