Wrap text around a web part in Office 365 Sharepoint 2013

By default web parts fill the entire zone making it difficult to control your page layouts. One way to position other content next to a web part is to add a css float to the web part. To do that:
Insert your web part on the page
Click the web part to select it and click “Edit Html Source” in the ribbon.
Add a class to the first div in the highlighted section – something like “class=”floatleft” …..

060414_1436_wraptextaro1

 

Right after the end of the highlighted web part bit, paste in your text and save the page
Open the style sheet under “Site” in the ribbon
Add the following rule: .floatleft{float:left;}
Optionally add a margin to separate the elements: .floatleft{float:left;margin-right:20px;}
Save the stylesheet.

Clear The Float.
When you use a float, all subsequent content that can fit in the available space will be moved next to the floated object. If you want to end the float at a certain point and resume the normal flow of the page, add this:

060414_1432_wraptextaro2

Here’s an example of the effect:
http://365new.webbrewers.com/home/protected-page

Access hidden Office 365 Sharepoint Online site locations with windows explorer.

When you open a site in windows explorer, you’re actually exposing the root of the site which can be useful if you need to add a file to the root or view your sitemap etc. Frustratingly though, Msft has hidden various directories from view. The _catalogs directory, for example, which contains all the critical stylesheets, master pages etc can’t be accessed this way. If you don’t want to struggle with Sharepoint Designer, here’s a trick to reveal all user accessible files in explorer:Open network places (or location or whatever your os calls it) and click “add a network place”
TIP: if you get an access denied error, make sure you’re logged in via IE.

To access the root of the site:

Enter https://-public.sharepoint.com/

For a specific directory:
Enter https://-public.sharepoint.com/_catalogs
For a 2013 site you’ll then need to open the master page directory and select the folder for your region (eg en-us)
Once you’ve established a network place you can navigate to it and open the css files in notepad.
After making your changes, you will have to save the file locally, open 2 explorer instances and drag it over to the appropriate sharepoint directory because you can’t save directly to sp (for some reason).
Now you can work directly with critical site files without having to deal with the perennial browser glitches and slowness of the user interface.
Questions?

Visit my forum » if you have any questions. For development work, you can contact me here ». And if you think this would be useful to others, feel free to share it by clicking one of the share buttons up top!