Editing CSS on Visual Studio - General Discussions - General Discussions - Progress Community
 General Discussions

Editing CSS on Visual Studio

  • Editing CSS on Visual Studio
  • Hi Telerik

    I ve just started to use Sitefinity trial version and completed my website's prototype on Sitefinity Project Manager.Now i want to change background colors and other CSS stuffs and I also want to add some JavaScript to my website.

    The problem is: i couldnt find the required tools on Sitefinity CMS page.Secondly,I am using Microsoft Visual Studio 2010 for coding my websites.When i clicked on "Edit in Visual Studio" on Sitefinity Project Manager, VS10 is oppening but i couldnt find the exact files in the filelist.Actually there is nothing related with my Sitefinity project in Visual Studio.

    ***Where can i find the css,jscript,aspx etc. files of my project and modify them?

    Note: I am a newbie web developer,please answer my question in the way i can understand...step by step if possible =)

    Regards.
  • 99.9% of Sitefinity is all embedded into the .DLLs you see (which is awesome)

    So can you provide some more details?  Are you using\modifying the "Basic" theme, or have you created your own?  Are you using a physical .master page or using the Template editor to create one?

    Steve
  • Hi can,

    Actually these are embedded resources and are contained in our default theme, that's why you are not able to find the physical files in VS. However, you can easily inspect with a toll  (e.g. Firebug) what CSS we're loading on the pages and create you custom theme, more information on creating themes can be found in our Designer's guide.
    Regarding *.aspx, do you mean the pages you have created in Sitefinity? Those are stored in the Database, however applying javascript to a Sitefinity page is very easy - you just need to drop a JavaScript widget (the Scripts section in the widget toolbox, when you open the page for editing).

    I hipe you find this information useful. I'll be glad to answer any additional questions you might have regarding this functionality, please do not hesitate to get back to me.

    Greetings,
    Boyan Barnev
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  • Hi Steve and Boyan

    Thanks very much for your kind and useful replies.I fixed the Jscript problem and now im checking out your "designer's guide".However,i still could not found how to change background colors of my site.I created my own  template manually(started from scratch) and there are light grey and white colors at the background.I want to change them to another colors(e.g black and darkgrey...i am an intern and my boss wants so :) .

    My second question is what is the function of "edit in visual studio" on Sitefinity Project Manager.How can i use Visual Studio on my Sitefinity projects without the physical files in it?.

    I know i am asking too much but this is because of i am very new on web devoloping and Sitefinity provides me more than i can do(Best Software i have ever seen;)..thanks in advance for you interest =)

    Regards..
  • Hello can,

    One option for modifying the CSS that's loaded, is, like I mentioned before by using a custom theme for Sitefinity, you can actually check this tutorial, I believe it might make it easier to introduce you to the concept. Another option is to simply drop a CSS widget on your page/template and write your custom CSS there (the CSS widget is located again in the widgets toolbox on your page/template under the Scripts and Styles section. For testing purposes you can add the following CSS:
    body
    background: red;
    Please note you need to publish the page for the CSS to apply. More information on the widget can be found here.

    Now on the second question related to VS - using the edit in Visual Studio option gives you the option of adding your own web user controls, application modules, masterpage templates which you can use in Sitefinity, as well as modify the existing configuration files. You can take a look at the tutorials section from our Documentation, I believe you will find it useful.

    Greetings,
    Boyan Barnev
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  • Hi Boyan

    I clearly understood all you explained clearly.I applied and they worked!

    One more little question.When i use a css widget on my site.It affects whole page.How can i use CSS widget on a specific place on my page(e.g a Content Box,Image)?
  • 280374_FireBug.png
    Hi can,

    You'll need to inspect the element with FireBug for instance and see which classes are applied to that html element. Then you can modify these classes in your custom CSS. Please take a look at the attached screenshot.

    All the best,
    Boyan Barnev
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  • I want to add code to the pages i have created in sitefinity.
    When i open my sitefinity project in visual studio,I could not find those pages listed over there.Please provide me the way to get that.
  • I want to add code to the pages i have created in sitefinity.
    When i open my sitefinity project in visual studio,I could not find those pages listed over there.Please provide me the way to get that.
  • Tanika,
    All the pages that you create through the Sitefinity Backend Interface are stored in the database. You will not see any pages that you create in Visual Studio. If you want to add code to a page, then the best way would probably be by way of a User / Custom Control which you can then drop onto the page. If you want to add CSS, then there is a control provided to do that. I have added code through my own master pages as well, in the past. All content that you create in Sitefinity goes in the database. Hope this helps.
    Andrei
  • @Andrei,
      Also too don't forget in the properties of a page at the bottom you can specify a custom codebehind class for it to use
    "Code behind type (for ASP.NET developers)"
  • @Steve Good point !