Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Inserting Background Images in SharePoint 2010

Status
Not open for further replies.

gstr6800

Technical User
Jan 19, 2008
5
US
Ok SP gurus, I am in a bind and would like to pick some brains. I am using SP2010 and trying to insert background images, not inserting a basic photo in line with text, but background images. I am using a simple template and layout with two webparts (left and right). The main one I can concerned with is my left webpart that is currently set as a Content Editor webpart. At the moment, I have a photo inserted, but it is below all of my text. I have been reading around for helpful tips for inserting a "background-image", but I am having no success.

I have no HTML or CSS experience, so lets call me a beginner. After reading through the current coding, I can understand how and why the information appears as it has. If I need to add text using either of the different types of coding, that is no problem. I can even add color, but no image. I have images loaded on my SP image page that I can chose from. How would I be able to insert an image with text on top of it? That is where I am trying to go. In referencing a url on my own site (to point to the photo I need), who does this work?

To give you a gist of what I am working with, here is some script that I would like to put a background image under:

<DIV style="MARGIN-BOTTOM: 20px; TEXT-ALIGN: justify">
<P class="siopub_title ms-pageTitle">RIMC Pretoria</P>
<P><FONT face=Verdana><STRONG>Thanks for visiting the SharePoint team site for the our company! This online community serves as a central source and repository ....</STRONG></FONT></P></DIV>

I would like to add and image, but this is the code I have:

from
background-image: url("myimage.gif")
to
background-image: url(
... with no success. It never finds the image. After a few variations of this, the script will disappear all together. I am using the Rich Text Editor to make the change.

Any help will be absolutely appreciated. I find that hardly any website using SP has an image background, but there seems to be quite a bit of information on adding this. Weird. Thanks in advance.
 
No. This system has software limitations that will not allow us to install it on our workstations. I will look around to see if our corporate admins will release this for use. Any other suggestions that can be considered in the meantime?
 
only thing i can think of.

you need to access the html in the page, not a web part.

designer is the only way i know of the modify the html in the page....

there is no reason why they should block Designer.


 
Thanks for the information. I will see what I can do from here.
 
Hi there, I am in excactly the same situation. New to SP and my company have locked down lots of capablities and SP designer. Basically we're being left to work it all out for ourselves.

I also need to embed an image as backgroud or at least be able to wrap the text around it! If you manage to crack it let me know, and I will too.

I do have access to the HTML code although most attempts I have made to change it have not worked. I tried creating the webpage in MS Publisher and then copy the code into the page (didn't work, but from what I am reading the format needs to be .ASPX and for that you need Microsoft Visual Studio. So maybe see if you have that available? I don't :-(

Best of luck
 
i'll try and get at this another way and post up a 'how to'.

if you are going to created your own aspx pages, you need to make sure you have the correct master page reference. you could always create a new page sharepoint, save it to the Pages library, then edit it from Notepad++ or something like that.

the issue with the content editor web part is, it wont cover the entire page. you can do some fun stuff with this web part and the html form web part. (*think* it's called html form)


being the sharepoint farm admin for a medium size company, i can understand locking down Designer. BUT, if a user proves they can do things correctly in sharepoint, i don't mind giving them access to Designer. Designer has a LOT of power, and a usser can bring down an entire site.

 
again, if you have a My Site, use it to play around, or create a test site.

Without Designer, you should be able to navigate to the root of the site. Open a Library, then click on Open with Explorer, then navigate to the root of the site. You should see a file named default.aspx. MAKE A COPY OF THIS FILE.

Now, open default.aspx with Notepad++ or Notepad.

Code:
<asp:Content contentplaceholderid="PlaceHolderMain" runat="server">
	<div class="ms-alignright">
    <SPSWC:SetPersonalSiteButton runat="server" id="TBBPersonalSiteButton" class="ms-toolbar" ShowImageAndText="false"/>
  </div>

  <table border="0" cellpadding="0" cellspacing="0" ID="ZoneTable" width="100%" style="background-image:url('SiteCollectionImages/MyCustomBackground.png')"> <tr ID="TopRow" > <td>&nbsp;</td> <td valign="top" ID="TopCell" colspan="3">

Notice the
style="background-image:url('SiteCollectionImages/MyCustomBackground.png')"

SiteCollectionImages is a Document Library, and MyCustomBackground.png is my image. Make sure everyone has read access to the image file.

Holler if you have any issues/questions.

 
Thanks for the input. I will see where I can take this. Let me get back to you in a few days.
 
I struggled for monthes trying to figure this out. We also have SPD locked down so I am always looking for workarounds. Happens to work if you put the image into a table...positioning the text is still a bear so you'll have to work on that but this is what I can give you:

HTML:
<table background="[URL unfurl="true"]http://your[/URL] SharePoint site/Image%20Library/your image.jpg"><tbody><tr><td><p>this is text </p></td></tr></tbody></table>

Hopefully this helps.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top