Change Webpart Theme Dynamically on Section Change

%3CLINGO-SUB%20id%3D%22lingo-sub-2112840%22%20slang%3D%22en-US%22%3EChange%20Webpart%20Theme%20Dynamically%20on%20Section%20Change%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-2112840%22%20slang%3D%22en-US%22%3E%3CP%3EI%20recently%20had%20to%20write%20some%20webparts%20that%20adapted%20to%20the%20theme%20(Section%20backgrounds%20etc)%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20have%20put%20together%20a%20little%20demo%20on%20how%20to%20change%20a%20webparts%20theme%20elements%20on%20a%20section%20change%20event%20(e.g.%20When%20User%20changes%20the%20background)%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EVideo%20link%20here%3A%20%3CA%20href%3D%22https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3Dd-XF1uFwTN0%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3Dd-XF1uFwTN0%3C%2FA%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ESource%20Code%20here%3A%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fgithub.com%2FYorcloud%2Fspfx-dynamic-theme-demo%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3Ehttps%3A%2F%2Fgithub.com%2FYorcloud%2Fspfx-dynamic-theme-demo%3C%2FA%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20hope%20you%20find%20it%20useful%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThanks%3C%2FP%3E%3CP%3E%3CBR%20%2F%3ERob%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E
Occasional Contributor

I recently had to write some webparts that adapted to the theme (Section backgrounds etc)

 

I have put together a little demo on how to change a webparts theme elements on a section change event (e.g. When User changes the background)

 

Video link here: https://www.youtube.com/watch?v=d-XF1uFwTN0

 

Source Code here: https://github.com/Yorcloud/spfx-dynamic-theme-demo

 

I hope you find it useful

 

Thanks


Rob

 

Short tutorial on how to react to the theme change event (e.g. Section Background changes) and theme your webpart accordinglySource code is available here: h...
0 Replies