in tutor, I working with lettest release Olive and now I want to need some changes in the header and footer which will come for mfe like the courses page, Discussion, profile and so more. so I figured out tutor mfe header and footer coms from this repo so I need to fork this below repo and do changes is there any other way to customize my own header and footer or any plugin way like this so please guide me on what can I do. Thanks in Advance
from tutor import hooks
hooks.Filters.ENV_PATCHES.add_item(
(
"mfe-dockerfile-post-npm-install",
"""
# npm package
RUN npm install '@edx/frontend-component-header@npm:@edx/frontend-component-header-edx@latest'
# git repository
RUN npm install '@edx/frontend-component-footer@git+https://github.com/edx/frontend-component-footer-edx.git'
"""
)
)
_variables.scss (for example to change the background color in footer use variables)
$gray-footer: #B6AEE1;
To make the changes you need to be aware of how files are imported in the MFE apps and what code you want to override, also you can delete files you don’t need. for example, all the images.
Create a plugin to install the package:
hooks.Filters.ENV_PATCHES.add_item(
(
“mfe-dockerfile-post-npm-install”,
“”"
RUN npm install ‘@edx/brand@git+https://github.com//brand.git’
“”"
)
)
run commands tutor config save and tutor images build mfe
run tutor local start and you have to see your changes.
it is very useful everyone can try it If need to customize the header & footer and also customize related mfe.i also try this all way and all of us work for me for a couple of days ago.
Hola disculpa tengo el mismo problema, si no es mucha molestia como lo pudiste resolver ? Estoy intentando modificar mi encabezado y pie de página pero aún no encuentro la forma, agradecería tu apoyo
Hello. This is the closest post related to my question so far, so I would like to ask it still. Same principle of editing the tutor mfe header and footer, I want to edit tutor mfe payment template.
This is the page where it goes to upon processing payments https://apps.local.overhang.io/payment
can please share the standard way to customize the header and footer
with the steps so it is easy to customize?
and also share the production-based steps for the same.
started one discussion for that
@Yagnesh I just want to know what is the standard way is there any other way we have for the header and footer customization or not please say cause I need to implement it on the production so asking
and please send me the plugin content so I can get a better idea of what I need to add to the plugin.
and repository of header and footer no need to clone right only add both in our private repo for development and need to add this in the plugin it takes automatically and installs the same.
I just want to customize the login page of authn mfe and learners dashboard: I do the following instruction by:
1: Fork the GitHub - openedx/brand-openedx, and push it to my own github resporitory.
create my mfe file in .local/share/tutor-plugins, inside this folder I create custommfe.py and inside that file I do
I just want to customized this. Change the color of buttons and backgroud, but nothing change after run tutor images build mfe and tutor local start -d