The first step to using CSS is to create a style sheet. Learn how to create a new CSS file and where to store it in SharePoint for later use.
- [Narrator] Let's start preparing to modify our site.…Our first step is going to be creating…a new blank style sheet and loading it up…to our SharePoint site.…Now you can use any text editor application to create…the style sheet.…I'm going to use Windows Notepad…because I'm basically a PC guy.…Now since you can't load an empty file to SharePoint,…I'm going to put in some placeholder text here.…This is a comment code for CSS,…so it won't have any effect on our styles.…Stroke, asterisk, CSS,…and close it off with an asterisk and a stroke.…
Perfect.…Now, I'll save this as a CSS file, so we click file,…save as, and we need to change this text documents.…We need to change that to all files,…very, very important.…We will call this…modifiedstyle.css.…That .css is also very, very important.…I'm going to save it to my desktop so I can…easily get it later.…Just click save, and there we go.…
Now let's go back to SharePoint.…Now that we're back in SharePoint,…my recommendation is that you save…that CSS file into the site assets.…
Author
Phil Gold
Released
1/8/2018- Changing your site's logo, title, and theme
- Creating new palettes and themes
- Loading fonts to your site
- Calling font sets in your theme
- CSS basics for branding SharePoint
- Creating and uploading a blank CSS style sheet
- Modifying site navigation, fonts, and backgrounds
- Styling tables
- Defining new elements in your CSS file
- Creating new CSS elements directly into the style sheet
Skill Level Intermediate
Duration
Views
-
Introduction
-
Welcome2m
-
What you need to know2m 5s
-
Course files1m 19s
-
-
1. The Branding Hierarchy
-
Change site logo and title3m 25s
-
Change site theme6m 29s
-
2. Creating a Custom Theme: Colors
-
3. Adding New Fonts
-
Sources for fonts2m 40s
-
Loading fonts to your site3m 50s
-
4. CSS Basics for Branding SharePoint
-
Why use CSS?2m 36s
-
Editing the CSS style sheet4m 53s
-
-
5. Modify SharePoint with CSS
-
6. More Styling: Page Elements
-
Style "new experience" pages3m 48s
-
Styling tables5m 53s
-
-
7. Getting Fancy: Custom CSS Elements
-
Initial considerations2m 9s
-
Allow for variable states3m 53s
-
-
Conclusion
-
Next steps1m 31s
-
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Creating and uploading a blank CSS style sheet