Our implementation looks very similar to Mark's. We created 2 additional
components in the app/info directory of our theme, one for an About
component and one for a Guidelines component. I started by just copying one
of the existing "feedback" or "privacy" directories (I forget which one I
used, but either will work) then changed the filename names, content,
selectors etc. I modified lazy-theme.module.ts in my theme folder to
import my 2 new components. This seems to mimic what Mark did according to
that diff in Slack.
Where Mark and I differ is how I added those 2 components to DSpace. We
wanted an About menu at the start of the nav bar with a dropdown for our
About and Guidelines pages, and wanted the URLs to be like the Feedback URL
(/info/feedback) i.e. /info/about and /info/guidelines. To do this I
modified the core /src/app/info/info-routing.module.ts and imported my 2
components there and added this right below the existing FEEDBACK_PATH path
(around line 20)
{
path: 'about',
component: AboutComponent,
resolve: { breadcrumb: I18nBreadcrumbResolver },
data: { title: 'info.about.title', breadcrumbKey: 'info.about' },
},
{
path: 'guidelines',
component: GuidelinesComponent,
resolve: { breadcrumb: I18nBreadcrumbResolver },
data: { title: 'info.guidelines.title', breadcrumbKey:
'info.guidelines' },
}
To add my About menu and the dropdown options (this may not be needed for
7.6 as I think there have been some additional themable components added
related to the nav bar; I did this in 7.4 initially) I added this section
to /src/app/menu.resolver.ts at about line 96 (i.e I inserted these as the
very first entries in the menuList array in createPublicMenu, right before
the existing Communities and Collections element)
/* About */
{
id: `about_about`,
parentID: 'about',
active: false,
visible: true,
model: {
type: MenuItemType.LINK,
text: `info.about.title`,
link: `/info/about`
} as LinkMenuItemModel
},
{
id: `about_guidelines`,
parentID: 'about',
active: false,
visible: true,
model: {
type: MenuItemType.LINK,
text: `info.guidelines.title`,
link: `/info/guidelines`
} as LinkMenuItemModel
},
{
id: 'about',
active: false,
visible: true,
index: 0,
model: {
type: MenuItemType.TEXT,
text: 'menu.section.about'
} as TextMenuItemModel,
},
I don't like having to modify code outside of the theme, but I was in a bit
of a rush to get this working. I think 7.6 made some additional nav
related stuff themable so I might be able to undo that last modification.
I haven't actually investigated that yet.
- Darryl
On Monday, October 2, 2023 at 9:51:09 AM UTC-6 Carolyn Sullivan wrote:
> Oh wait, I see Mark has helpfully shared his code in the DSpace Slack:
> https://dspace-org.slack.com/archives/C3TTSEB1V/p1694715563285319
>
> The changes aren't working in my repo so far, but this gives me a good
> starting point--thanks Mark!
>
> On Monday, October 2, 2023 at 9:43:43 AM UTC-4 Carolyn Sullivan wrote:
>
>> Hello,
>>
>> Thank you for opening this thread. I have the same problem as Mariusz
>> originally did, and was wondering if anyone could offer some more specific
>> recommendations regarding Mark Wood's solution.
>>
>> On our repository, we added an additional link to the navbar menu like so:
>>
>> <li ngbDropdown class="nav-item d-flex align-items-center">
>> <a class="nav-link " role="button" data-toggle="dropdown"
>> aria-expanded="false" ngbDropdownToggle> About </a>
>> <div ngbDropdownMenu class="m-0 border-top-0 ng-trigger
>> ng-trigger-slide shadow-none" id="customDrop">
>> <a ngbDropdownItem style="color: #207698"
>> href="assets/about/uo-research.html">UO-Research</a>
>> <a ngbDropdownItem style="color: #207698"
>> href="assets/about/policies.html">Policies</a>
>> <a ngbDropdownItem style="color: #207698"
>> href="assets/about/faq.html">FAQ</a>
>> </div>
>> </li>
>>
>> To use this structure but have it link to a view with the DSpace
>> header/footer and text content sandwiched between, would we then create a
>> component in our custom/app folder, and then use a routing
>> module/routerlink to get to that component view instead of using the static
>> link here (https://angular.io/tutorial/tour-of-heroes/toh-pt5)? Is that
>> the simplest way of doing it?
>>
>> Thanks,
>> Carolyn.
>>
>>
>> On Friday, June 10, 2022 at 8:39:52 AM UTC-4 Mariusz wrote:
>>
>>> It enlightened me and I have done it in the meantime. I just doubled the
>>> privacy component accordingly. Managed to. It works. But thanks for any
>>> suggestions.
>>>
>>> Regards
>>> Mariusz
>>>
>>> piątek, 10 czerwca 2022 o 14:25:27 UTC+2 [email protected] napisał(a):
>>>
>>>> On Fri, Jun 10, 2022 at 02:35:00AM -0700, Mariusz wrote:
>>>> > It works, but how can I make static pages look like the rest. I would
>>>> like
>>>> > a page with static content that looks like other pages in my
>>>> repository. I
>>>> > have already created my own theme. I would like to have additional
>>>> (themed)
>>>> > pages with my permanent content, as now they have info/privacy
>>>> (Privacy
>>>> > Statement) or info/end-user-agreement (End User Agreement) . Pages
>>>> with my
>>>> > own info. I don't know if I'm explaining well. ;)
>>>>
>>>> So, I think you are saying that you want a page with all of the common
>>>> DSpace decorations, behaviors and styling, but with static content in
>>>> the middle. That does not sound like a static page, but a dynamic
>>>> page with fixed main content. I think that, to do this, you would
>>>> just write a component whose HTML template file contains no
>>>> placeholders and whose Typescript file contains no behaviors. Use the
>>>> theme's styling classes so that the rendering of your component tracks
>>>> changes to the theme.
>>>>
>>>> The "page" is assembled by Angular in the browser, and the stuff in
>>>> the middle that changes as you navigate is just one part of the
>>>> assembly. https://en.wikipedia.org/wiki/Single-page_application
>>>>
>>>> --
>>>> Mark H. Wood
>>>> Lead Technology Analyst
>>>>
>>>> University Library
>>>> Indiana University - Purdue University Indianapolis
>>>> 755 W. Michigan Street
>>>> Indianapolis, IN 46202
>>>> 317-274-0749 <(317)%20274-0749>
>>>> www.ulib.iupui.edu
>>>>
>>>
--
All messages to this mailing list should adhere to the Code of Conduct:
https://www.lyrasis.org/about/Pages/Code-of-Conduct.aspx
---
You received this message because you are subscribed to the Google Groups
"DSpace Community" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/dspace-community/d7191f90-aab1-434e-b95e-81b057a3430an%40googlegroups.com.
