33< head >
44 < title > CL-web-components</ title >
55 < link rel ="stylesheet " href ="/css/site.css ">
6- < link rel ="stylesheet " href =". /css/code-blocks.css ">
7- < script type ="module " src =". /copyToClipboard.js "> </ script >
8- < script type ="module " src =". /footer-global.js "> </ script >
6+ < link rel ="stylesheet " href ="https://media.library.caltech.edu/cl-webcomponents /css/code-blocks.css ">
7+ < script type ="module " src ="https://media.library.caltech.edu/cl-webcomponents /copyToClipboard.js "> </ script >
8+ < script type ="module " src ="https://media.library.caltech.edu/cl-webcomponents /footer-global.js "> </ script >
99</ head >
1010< body >
1111< nav >
1212< ul >
1313 < li > < a href ="/ "> Home</ a > </ li >
1414 < li > < a href ="index.html "> README</ a > </ li >
1515 < li > < a href ="LICENSE "> LICENSE</ a > </ li >
16- < li > < a href ="user_manual.html "> User Manual</ a > </ li >
1716 < li > < a href ="INSTALL.html "> INSTALL</ a > </ li >
17+ < li > < a href ="user_manual.html "> User Manual</ a > </ li >
1818 < li > < a href ="about.html "> About</ a > </ li >
1919 < li > < a href ="search.html "> Search</ a > </ li >
2020 < li > < a href ="https://github.com/caltechlibrary/CL-web-components "> GitHub</ a > </ li >
@@ -144,13 +144,17 @@ <h3 id="custom-phone-and-email">Custom Phone and Email</h3>
144144< span id ="cb8-11 "> < a href ="#cb8-11 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> </</ span > < span class ="kw "> footer</ span > < span class ="er "> -global</ span > < span class ="dt "> ></ span > </ span > </ code > </ pre > </ div >
145145< h3 id ="custom-social-media-links "> Custom Social Media Links</ h3 >
146146< p > In the second column, you can also customize the social media links
147- in the Footer-Global component. Currently, the component only supports
148- Instagram and YouTube. To add more social links, please contact the
149- developers of this component. You will customize these by defining an
150- attribute in the html element.</ p >
147+ in the Footer-Global component. Currently, the component supports
148+ Instagram, YouTube, and RSS. To add more social links, please contact
149+ the developers of this component. You will customize these by defining
150+ an attribute in the html element.</ p >
151+ < p > The defaults for Instagram and Youtube are the library’s profiles.
152+ There is no default for the RSS feed. If one is not defined, no icon
153+ will display.</ p >
151154< ol type ="1 ">
152155< li > Add attribute < code > instagram="your-profile-url"</ code > </ li >
153156< li > Add attribute < code > youtube="your-profile-url"</ code > </ li >
157+ < li > Add attribute < code > rss="your-rss-url"</ code > </ li >
154158</ ol >
155159< div class ="sourceCode " id ="cb9 "> < pre
156160class ="sourceCode html "> < code class ="sourceCode html "> < span id ="cb9-1 "> < a href ="#cb9-1 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> <</ span > < span class ="kw "> footer</ span > < span class ="er "> -</ span > < span class ="ot "> global</ span > </ span >
@@ -159,13 +163,14 @@ <h3 id="custom-social-media-links">Custom Social Media Links</h3>
159163< span id ="cb9-4 "> < a href ="#cb9-4 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="ot "> phone</ span > < span class ="op "> =</ span > < span class ="st "> "xxxxxx"</ span > </ span >
160164< span id ="
cb9-5 "
> < a href ="
#cb9-5 "
aria-hidden ="
true "
tabindex ="
-1 "
> </ a > < span class ="
ot "
> email
</ span > < span class ="
op "
> =
</ span > < span class ="
st "
> "
[email protected] "
</ span > </ span > 161165< span id ="cb9-6 "> < a href ="#cb9-6 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="ot "> instagram</ span > < span class ="op "> =</ span > < span class ="st "> "your-profile-url"</ span > </ span >
162- < span id ="cb9-7 "> < a href ="#cb9-7 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="ot "> youtube</ span > < span class ="op "> =</ span > < span class ="st "> "your-profile-url"</ span > < span class ="dt "> ></ span > </ span >
163- < span id ="cb9-8 "> < a href ="#cb9-8 " aria-hidden ="true " tabindex ="-1 "> </ a > </ span >
164- < span id ="cb9-9 "> < a href ="#cb9-9 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> <</ span > < span class ="kw "> a</ span > < span class ="ot "> slot</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> class</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> aria-label</ span > < span class ="op "> =</ span > < span class ="st "> "footer navigation"</ span > < span class ="ot "> href</ span > < span class ="op "> =</ span > < span class ="st "> "#"</ span > < span class ="dt "> ></ span > Custom Link 1< span class ="dt "> </</ span > < span class ="kw "> a</ span > < span class ="dt "> ></ span > </ span >
165- < span id ="cb9-10 "> < a href ="#cb9-10 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> <</ span > < span class ="kw "> a</ span > < span class ="ot "> slot</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> class</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> aria-label</ span > < span class ="op "> =</ span > < span class ="st "> "footer navigation"</ span > < span class ="ot "> href</ span > < span class ="op "> =</ span > < span class ="st "> "#"</ span > < span class ="dt "> ></ span > Custom Link 2< span class ="dt "> </</ span > < span class ="kw "> a</ span > < span class ="dt "> ></ span > </ span >
166- < span id ="cb9-11 "> < a href ="#cb9-11 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> <</ span > < span class ="kw "> a</ span > < span class ="ot "> slot</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> class</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> aria-label</ span > < span class ="op "> =</ span > < span class ="st "> "footer navigation"</ span > < span class ="ot "> href</ span > < span class ="op "> =</ span > < span class ="st "> "#"</ span > < span class ="dt "> ></ span > Custom Link 3< span class ="dt "> </</ span > < span class ="kw "> a</ span > < span class ="dt "> ></ span > </ span >
167- < span id ="cb9-12 "> < a href ="#cb9-12 " aria-hidden ="true " tabindex ="-1 "> </ a > </ span >
168- < span id ="cb9-13 "> < a href ="#cb9-13 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> </</ span > < span class ="kw "> footer</ span > < span class ="er "> -global</ span > < span class ="dt "> ></ span > </ span > </ code > </ pre > </ div >
166+ < span id ="cb9-7 "> < a href ="#cb9-7 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="ot "> youtube</ span > < span class ="op "> =</ span > < span class ="st "> "your-profile-url"</ span > </ span >
167+ < span id ="cb9-8 "> < a href ="#cb9-8 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="ot "> rss</ span > < span class ="op "> =</ span > < span class ="st "> "your-rss-url"</ span > < span class ="dt "> ></ span > </ span >
168+ < span id ="cb9-9 "> < a href ="#cb9-9 " aria-hidden ="true " tabindex ="-1 "> </ a > </ span >
169+ < span id ="cb9-10 "> < a href ="#cb9-10 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> <</ span > < span class ="kw "> a</ span > < span class ="ot "> slot</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> class</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> aria-label</ span > < span class ="op "> =</ span > < span class ="st "> "footer navigation"</ span > < span class ="ot "> href</ span > < span class ="op "> =</ span > < span class ="st "> "#"</ span > < span class ="dt "> ></ span > Custom Link 1< span class ="dt "> </</ span > < span class ="kw "> a</ span > < span class ="dt "> ></ span > </ span >
170+ < span id ="cb9-11 "> < a href ="#cb9-11 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> <</ span > < span class ="kw "> a</ span > < span class ="ot "> slot</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> class</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> aria-label</ span > < span class ="op "> =</ span > < span class ="st "> "footer navigation"</ span > < span class ="ot "> href</ span > < span class ="op "> =</ span > < span class ="st "> "#"</ span > < span class ="dt "> ></ span > Custom Link 2< span class ="dt "> </</ span > < span class ="kw "> a</ span > < span class ="dt "> ></ span > </ span >
171+ < span id ="cb9-12 "> < a href ="#cb9-12 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> <</ span > < span class ="kw "> a</ span > < span class ="ot "> slot</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> class</ span > < span class ="op "> =</ span > < span class ="st "> "custom-links"</ span > < span class ="ot "> aria-label</ span > < span class ="op "> =</ span > < span class ="st "> "footer navigation"</ span > < span class ="ot "> href</ span > < span class ="op "> =</ span > < span class ="st "> "#"</ span > < span class ="dt "> ></ span > Custom Link 3< span class ="dt "> </</ span > < span class ="kw "> a</ span > < span class ="dt "> ></ span > </ span >
172+ < span id ="cb9-13 "> < a href ="#cb9-13 " aria-hidden ="true " tabindex ="-1 "> </ a > </ span >
173+ < span id ="cb9-14 "> < a href ="#cb9-14 " aria-hidden ="true " tabindex ="-1 "> </ a > < span class ="dt "> </</ span > < span class ="kw "> footer</ span > < span class ="er "> -global</ span > < span class ="dt "> ></ span > </ span > </ code > </ pre > </ div >
169174< h3 id ="custom-logo "> Custom Logo</ h3 >
170175< p > In the last column, you can use attributes to switch between the
171176library or the archives logo by defining an attribute in the html
@@ -227,4 +232,4 @@ <h3 id="potential-enhancements">Potential Enhancements</h3>
227232</ section >
228233< footer-global > </ footer-global >
229234</ body >
230- </ html >
235+ </ html >
0 commit comments