Creating Teaser Intros for Blog Posts

One thing I have been wanting to do with blog posts is create teaser intros, show x amt of characters of the post followed by a link to read the rest of the post. Sadly, SP does not provide this functionality out of the box. So I Googled the problem and found a site with the solution. The problem is the solution is hard to understand and my eyes glazed over trying to understand what the author was asking me specifically to do. I eventually got the fix to work, and decided that I probably wasn’t the only person who didn’t speak code who might need this solution, so I decided to paraphrase the authors fix in designer-ese… I take ZERO credit for the fix, please visit the author below for the original post:

Original fix/code: http://zabistop.blogspot.com/2009/02/customizing-sharepoint-blog-posts-web.html

Step 1: Open SP Designer
Step 2: Open Blog site in Designer
Step 3: Open default.aspx
Step 4: Click at the very top of the List View Web Part for the posts and then right-click. Select Convert to XSLT Data View:

Step 5: Go into code view and do a find for: ms-postbody. It should bring you to the area of code that you need to swap out. Below is the code that needs to be replaced:
Replace this code...

Replace with this:
with this code...

(aside: I am trying in vain to upload a file that allows you to copy and paste the code, but the crappy WordPress interface wont do it! Can’t add code to the page or the stupid thing tries to execute it, even in code tags! Stupid app!)

The 250 in the last xsl: value snippet is the number of characters of text that is displayed-this number can be whatever you want. You can also change what the “more” link says, maybe to “Read Post” or whatever.

Step 6: Add new xsl template. Add the code below to the top of the page under an existing xsl:template snippet:

Now save and open the page in your browser.

Advertisements

Styling webpart data with the Data View Web Part

One of the things that as been driving me crazy is the inability to selectively style webparts. On the home page of my company’s intranet, I have several webparts pulling content in, and they all look the same. I primarily wanted to make the announcements web part look different. I tried every hack I could think of to find some kind of unique hook to attach some styling to. I would change the title style and then watch it change ever title on the page. I have been trying to find uses for the data view web part and so I thought, maybe I can use that to pull in the announcements and then style them…

Long story short, it worked. Using the dvwp I was able to pull in the announcements list, set what fields to display, and then individually style the display of those fields.

First, I created a page layout. You can’t add the dvwp to pages directly unless you create a page based off a page layout and then detach that page from the page layout in SPD before you work on it. On the page layout in Sharepoint Designer, I selected a web part zone, clicked on Data View in the toolbar, and then selected Insert Data View. I then pulled the announcements list onto the dvwp area. I clicked on the arrow to the right of the DVWP and the Common Data View Tasks box displayed.
Common Data View Tasks

First, I edited the columns. I removed all but Title and Body. Then I changed the layout to Repeating Form Style. I then set the paging to display items in sets of 4. Under Sort and Groups, I set it to sort by Created, descending.

Now it was time to style the content. First, I removed the word Body that displayed right over the body content. Then I moved the title xsl code to right above the body code. I created two styles, one to handle the title and one for the body. I wrapped the styles around the fields and then cleaned up the display a bit by removing the extra row, hr and br tags.
Wrapping styles around the fields.

Once that was done, I saved the layout, checked it in and then created a new page based off that layout. The dvwp displayed on the page as a webpart. I exported the webpart and then added it to the Web Part Gallery. I went to the intranet home page, put it in edit mode, and then added the webpart to the page.

One note, I tested this on my dev server first and made sure it worked before I tried it on production 😉

Standard SharePoint font makes marks tiny

My company has a ton of marks that they use in their company communications: copyrights, registration symbols, trademarks, etc. No matter what I did, they displayed so small as to be unreadable. Apparently, marks rendered in Calibri, the standard font for much of SharePoint, render too small, but if you change the font to something like tahoma, they show up fine. Since there is no way in css (or none that I know of) to target an html symbol, I wrap all marks in the sup tag, which raises them a little, like a mark should be anyway, and I changed the font-family attribute of the sup tag instead. Works!

Practical SharePoint: Creating Manuals

One of the main content sources on my intranet is manuals and guides: policy guides, managers guides, SOP guides, etc. Sinces manuals /guides is such an important content source, I set out to find an ideal SharePoint solution for creating them. The current way that manuals/guides are implemented on our existing intranet is pretty simple: Dreamweaver template for overall structure, library items for navigation, and manually created content pages.

My first thought was to try to use the Sharepoint blog functionality. I liked how you can set up categories and then easily assign posts to those categories. A few problems came up: one, posts display in the order they are input-I needed to control the exact order; two, posts have comments that can be added-I needed that functionality removed. I was able to overcome issue one, partly, by creating a bit of a hack. I created a column that allowed me to insert a number that I could filter by. The big problem here is if I want to change the order of the posts in the future, i need to change the number for each post individually. Also, I tried using the CQWP to filter by the number and it wouldnt pull correctly in the quicklaunch. So, I abandoned the blog idea.

The solution I came up with that I am actually using is to create a publishing subsite for each manual. I created a custom content type, custom site columns, and several custom page layouts to accommodate the different types of page content that the manuals would have. Many of the manuals on the intranet have contextual navigation depending on what section you are in. I created those navigation areas with the reusable content lists, pulling them into the custom page layouts with a RichHtml field control.

In the page layouts, I wrapped the content areas in a div id that I then used to target all of the html and custom css, allowing me to override the built in css for the pages. I created custom styles for tables, quotes, and images.

It still isn’t an easy task to create a manual. i have many steps I have to go through to set one up, but I think the long-term benefits will be worth it. Content types, site columns and page layouts are the foundation of the publishing features in SharePoint and are essential skills to master.

One final tip-Document everything!!!! It takes a lot of time, but once I figure out a process for doing something in SharePoint, I create a bunch of screenshots and i document everything i did to create it. I also have a project management SharePoint site where I catalog every element created for a site (content types, columns, page layouts, master pages, lookup lists, etc.), every site created, and all documentation created. There is so much stuff, you really can’t depend on your memory, so write it down!

Well, I have to get back to figuring out to build my company intranet-I’ll post more as I figure more out ;0)

Reusable Content List

So I am working on the project plan for the first release of our new intranet, working on the IA and such, and saw the need to have content in more than one place. I saw that there was a list called Reusable Content so I looked it up and it acts much like how library items work in Dreamweaver. Instead of adding the copy to multiple locations directly, you add the reusable content into the list, and then when you go to add the content in the specific locations, you tell the page to use source from the reusable content list. I think that this is very cool. You update the page once and it updates across the board wherever it is used. You can also use the list to just store a link or a paragraph-anything that may be repeated. Here is a really good overview: http://blog.funknstyle.com/?p=577

Changing Welcome page

I am currently building a small internal site to store SOX documentation for the company Internal Audit group. Because they deal with outside contractors who need access to this data, we will be using something called ADAM to allow users outside of our network access to the site. They need it so that an outside user only sees the document library they have access to, with no way to go up to the top level of the site. I had initially created seperate document libraries for each year, but was told that ADAM couldnt be used to secure a library, only sites. great. So I had to make seperate sites for each library. I created each site as a blank site with no other content than a document library. I wanted to make the welcome page go directly into the library, but the Welcome page option did not display under look and Feel.

I am learning that you pretty much just NEED to turn publishing on-just do it. You won’t be able to specify the Welcome screen without it, and you gain a lot of functionality with it turned on. So I turned on publishing, set the site to open into the library, and now I am waiting to see what my technical admin has to say about how ADAM works with it.

I’m still not sure I believe him when he says you cant secure a library, but I’m just a designer, so…

Moral of story: turn Publishing features on.