More in this section

Forums / General Discussions / Editing CSS on Visual Studio

Editing CSS on Visual Studio

12 posts, 0 answered
  1. can
    can avatar
    36 posts
    Registered:
    07 Jun 2011
    22 Jun 2011
    Link to this post
    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.
  2. Steve
    Steve avatar
    3037 posts
    Registered:
    03 Dec 2008
    22 Jun 2011
    Link to this post
    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
  3. Boyan Barnev
    Boyan Barnev avatar
    1429 posts
    Registered:
    30 Oct 2017
    22 Jun 2011
    Link to this post
    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
  4. can
    can avatar
    36 posts
    Registered:
    07 Jun 2011
    23 Jun 2011
    Link to this post
    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..
  5. Boyan Barnev
    Boyan Barnev avatar
    1429 posts
    Registered:
    30 Oct 2017
    23 Jun 2011
    Link to this post
    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
  6. can
    can avatar
    36 posts
    Registered:
    07 Jun 2011
    23 Jun 2011
    Link to this post
    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)?
  7. Boyan Barnev
    Boyan Barnev avatar
    1429 posts
    Registered:
    30 Oct 2017
    23 Jun 2011
    Link to this post
    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
  8. Tanika
    Tanika avatar
    2 posts
    Registered:
    15 Mar 2012
    16 Mar 2012
    Link to this post
    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.
  9. Tanika
    Tanika avatar
    2 posts
    Registered:
    15 Mar 2012
    16 Mar 2012
    Link to this post
    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.
  10. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    16 Mar 2012
    Link to this post
    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
  11. Steve
    Steve avatar
    3037 posts
    Registered:
    03 Dec 2008
    16 Mar 2012
    Link to this post
    @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)"
  12. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    16 Mar 2012
    Link to this post
    @Steve Good point !
12 posts, 0 answered