How to customize header and footer in tutor mfe

Hi @dcoa ,

Thank you, hope it works in your end, I just want to change the styles or background of mfe

Note: I am working in production

Hi @allen_luna,

I follow the steps and works for me

I write the steps:

  1. Create a tutor plugin. (following this tutorial Creating a Tutor plugin — Tutor documentation)
  2. I use this configuration understanding that the override is only for authn MFE:
from tutor import hooks

hooks.Filters.ENV_PATCHES.add_items(
    [
        (
            "mfe-dockerfile-post-npm-install-authn",
            """
    RUN npm install '@edx/brand@git+https://github.com/allenluna/VXI_Brand-OpenEdx.git'
    """
        ),
    ]
)
  1. Enable the plugin tutor plugins enable myplugin
  2. Save the configuration tutor config save
  3. Build the image tutor images build mfe
  4. Start my environment tutor <dev/local> start
1 Like

Hi @dcoa ,

What is your tutor version? Mine is tutor v17.0.2 and my mfe is v17.0.0

The same versions for tutor and tutor-mfe

Should I need to fork this? GitHub - overhangio/tutor-mfe: This plugin makes it possible to easily add micro frontend (MFE) applications on top of an Open edX platform that runs with Tutor.

but I already enable mfe plugins. And my custommfe plugins

No, you don’t need to fork tutor-mfe.
Just try

  1. check the myplugin syntaxis.
  2. Save the configs and build the images try tutor images build mfe --no-cache
1 Like

Thank you @dcoa , it works now

@allen_luna great!

Is your mistake related to a plugin or something else?

Hi @Yagnesh ,

No. Instead of using “mfe-dockerfile-post-npm-install” I directed “mfe-dockerfile-post-npm-install-authn”. I think it is a tutor version problem?

hello @dcoa ane @Yagnesh ,

i am working with the latest release quince .

i created plugin-able theme this theme is working as expected in tutor dev.

but in the tutor local i am facing below issue this is suprisable

can you please suggest some solutions if any.

Thanks in Advance :slightly_smiling_face:

Hi @Komal_Raval ,

how are you testing in dev and in local? just to have a better context

hii @dcoa ,

for testing the tutor local i configured the turor using below commad.

tutor local launch

for testing the tutor dev i configured the turor using below commad.

tutor dev launch

my question is is there any specific path we have to set the css in pluginable theme.

if you have the knowledge then can you please share the steps for customise the pluginable
theme with the path of css where we need to add and which format?

can you please suggest some solutions if any.

Thanks in Advance :slightly_smiling_face:

@Komal_Raval wanted to address the concerns you raised regarding the screenshot you provided and the issues with CSS not appearing correctly.

Upon reviewing the screenshot, it appears that there may be an issue with the CSS not rendering properly. However, as you mentioned, the theme is functioning correctly in the development environment.

you are trying to say in tutor dev that this things is working but when you are working on local you are facing following problems as per your screen short and can you please provide more details like share the plugin details you used and other necessary steps.

So things can be more clear to understand.

sure.

Thanks!!