External CSS to add banner to mulitple topics

Hi,
I am currently working on webpages for work which require a
company logo and header title image to appear on the very top
center of every page. There are over 500 pages. I have linked the
pages to one external style sheet but want to use the css to also
add an image to every page. I had tried the background img code:
BODY {
background: #ffffff url(filename.gif) no-repeat;
But this is not what I am looking for. I want to add an
actual image above the content of every page that is not part of
background. I also want a way to insert a footer image as well. Any
advice is welcomed. I would appreciate the code and the location
where I should place this code. I am fairly new to CSS.
thanks in advance!

I would recommend SSI (Server Side Includes) for both header
& footer.
"HTMLRobo12" <[email protected]> wrote in
message
news:f6m2ac$6u2$[email protected]..
> Hi,
>
> I am currently working on webpages for work which
require a company logo
> and
> header title image to appear on the very top center of
every page. There
> are
> over 500 pages. I have linked the pages to one external
style sheet but
> want to
> use the css to also add an image to every page. I had
tried the background
> img
> code: BODY {
> background: #ffffff url(filename.gif) no-repeat;
> }
>
> But this is not what I am looking for. I want to add an
actual image above
> the
> content of every page that is not part of background. I
also want a way to
> insert a footer image as well. Any advice is welcomed. I
would appreciate
> the
> code and the location where I should place this code. I
am fairly new to
> CSS.
>
>
> thanks in advance!
>
>

Similar Messages

How to add external css file from _edge.js file

I have tried to add in html page, but when I save edge project it removes it.
I am able to add external js file in scripts:[] in _edge.js file
What we can add inside resources:[] ?
And is there any way to add external css in edge files except in html page and through javascript?

...and which kind of files can be included under
resources: [] ??
I have a .json file that I need to be included in a template (and also included in projects created from that template).
The only way I found to do this is to add it as a script. The problem then is that all included "scripts" will be evaluated when the page is loaded, which will fail since it's a json file. External dependencies makes it impossible for me to change the format of the json file...

Add spry menu to external css or template

I have a working navigation menu at www.reachyourpotential.ca
but I haven't used an external style sheet on this website and that
seems to be the thing to do these days. I used cs3 to add a spry
horizontal menu to a template (standard cs3 2 column). Should I
move the spry menu to an external style sheet?
I believe the benefits of an external css are faster page
loading speed and better seo.
I am also revising a website for a client and want to get it
right the first time.
Which is better - add the spry menu to an external css or a
template?
Thank you.

This may sound really dumb as no one ever addresses this
issue, but once I create the Spry menu and then create all my other
pages from the template, what if I need to change something in the
menu? Since the href's are located in the HTML of the sheet itself,
not in the .css or .js, how do you get to the point where you just
change it one place and it changes everywhere?
Does this make sense? What piece of the puzzle am I missing?
Thanks for any assistance.

Unable to embed External CSS file, dropdown list,filter panel and dimension filter are not working in SAP Design Studio Tool

Hello Everyone,
I am new to SAP Design Studio. I am working on creating dashboards and I am using Design Studio 1.2 version. Please suggest some solutions for the following issues. Thanks in Advance.
1. External CSS file which is embeded using custom CSS option under "application component properties" is not working.
* I kept the external CSS file inside repository-> my application folder.
2. During runtime, getting javascript error while selecting '-' option from filter panel.
3. Unable to select or type dimension name under "dimension filer component" properties.
4. Getting runtime error for dropdown list, and I have inserted the following code under "onStartup" option of Application component properties.
"DROPDOWN_1.setItems(DS_1.getMemberList("PRODUCTREF", MemberPresentation.INTERNAL_KEY, MemberDisplay.TEXT, 20));
and dimension values are not populated in auto suggest."

There should be an Error Log under View > Error Log that gives you more details of these errors. Could you add that? There is also a View > Script Problems log that provides more details as well.

Template that does not let an external css to be attached

Hi
i have a template with en editable region for mainContent.
and it is applied to all the pages in my site.
now i want to attach an external css file to one of the pages
that is based on that template, and i get this message:
"a request to create a new style, link or import failed. if
you work with an instance of a template, make sure that you have an
editable region in the head tag".
so i went to my template and selected all the head tag and
made it an editable region.
but i still get the same message.
what can i do?
best regards

I am having the exact same problem but my template was saved as a template. I created a page from my template and made editable regions, when I go to create a style it tells me "A request to create a new STYLE, LINK, or IMPORT failed. If you are working with an instance of a template, make certain that there is an editable region within the head tag." I've tried making an editable region within the head tag and it still doesn't work.
Here is my code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Witmer Furniture</title>
<style type="text/css">
#container {
    width: 780px;
    margin-right: auto;
    margin-left: auto;
    background-color: #FFFFFF;
    margin-top: 0px;
</style>
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<script src="../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<link href="../footer.css" rel="stylesheet" type="text/css" />
<link href="../columnone.css" rel="stylesheet" type="text/css" />
<link href="../columntwo.css" rel="stylesheet" type="text/css" />
<link href="../columnthree.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    background-color: #000000;
</style>
</head>
<body>
<div id="container">
<div id="banner"><img src="../images/banner5.png" alt="Witmer Furniture" /></div>
<div id="cascading menu">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a class="MenuBarItemSubmenu" href="witmerfurniture.com">BEDROOM</a>
      <ul>
            <li><a href="#">Bedroom Sets</a></li>
            <li><a href="#">Beds</a></li>
            <li><a href="#">Nightstands</a></li>
            <li><a href="#">Dressers</a></li>
            <li><a href="#">Case Goods</a></li>
            <li><a href="#">Mirrors</a></li>
        </ul>
      </li>
<li><a href="#" class="MenuBarItemSubmenu">OCCASIONAL</a>
      <ul>
            <li><a href="#">Coffe Tables</a></li>
            <li><a href="#">End Tables</a></li>
            <li><a href="#">Sofa Tables</a></li>
        </ul>
      </li>
<li><a class="MenuBarItemSubmenu" href="#">ENTERTAINMENT</a>
      <ul>
            <li><a href="#">T.V. Stands</a> </li>
            <li><a href="#">Armoires</a></li>
        </ul>
      </li>
<li><a href="#" class="MenuBarItemSubmenu">HOME OFFICE</a>
      <ul>
            <li><a href="#">Desks</a></li>
            <li><a href="#">Bookcases</a></li>
            <li><a href="#">Cradenzas</a></li>
        </ul>
      </li>
<li><a href="#" class="MenuBarItemSubmenu">NEW PRODUCTS</a>
    <ul>
            <li><a href="#">Weston</a></li>
          <li><a href="#">Summit Lake</a></li>
        </ul>
      </li>
    </ul>
</div>

<div id="main">
    <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','wid th','780','height','280','title','flash','src','../Flash/WitmerFlash','loop','false','qual ity','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Ve rsion=ShockwaveFlash','wmode','transparent','movie','../Flash/WitmerFlash' ); //end AC code
    </script>
    <noscript>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="780" height="280" title="flash">
      <param name="movie" value="../Flash/WitmerFlash.swf" />
      <param name="quality" value="high" />
      <param name="LOOP" value="false" />
      <param name="wmode" value="transparent" />
      <embed src="../Flash/WitmerFlash.swf" width="780" height="280" loop="false" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>
    </object>
    </noscript>
</div>


<div id="body"><img src="../images/collections border.png" alt="Collections" width="780" height="30" /></div>
<div id="columnone">
    <ul>
      <li><a href="ashland.html">Ashland</a></li>
      <li><a href="brookb.html">Brook B</a></li>
      <li><a href="Clayton.html">Clayton</a></li>
      <li><a href="contemporary.html">Contemporary</a></li>
      <li><a href="darlington.html">Darlington</a></li>
    </ul>
</div>
<div id="columntwo">
    <ul>
      <li><a href="ellyg.html">Elly G</a></li>
      <li><a href="oakgrove.html">Oak Grove</a></li>
      <li><a href="southbay.html">Southbay</a></li>
      <li><a href="stratford.html">Stratford</a></li>
      <li><a href="summitlake.html">Summit Lake</a></li>
    </ul>
</div>
<div id="columnthree">
    <ul>
      <li><a href="taylorj.html">Taylor J</a></li>
      <li><a href="unity.html">Unity</a></li>
      <li><a href="weston.html">Weston</a></li>
    </ul>
</div>

<div id="footer">
    <ul>
      <li><a href="index.html">Home</a></li>
      <li><a href="aboutus.html">About Us</a></li>
      <li><a href="../contactus.html">Contact Us</a></li>
      <li><a href="sitemap.html">Site Map</a></li>
    </ul>
</div></div>

<script type="text/javascript">

</script>
</body>
</html>

How to use external CSS for standard items ?

Hi,
I would like to use my external CSS style-sheet for the standard items I add to my portal page.
I build an UI template with a CSS-link to my css style-sheet, and I used this UI template for my portal page. But it seems that items cannot use this UI template CSS reference.
Is there a way to use external CSS on standard items (text, url,...) ?
Thanks for your help,
Best Regards,
JC.AUDARD

Easiest way I find to do it is to drop your css file in the portal/images folder. Make a hidden html portlet on your template and link to /images/mycss.css. You can then use it for many items such as text, links, html portlets, etc.

Loading an external CSS stylesheet

I am new to Flash and trying to get an external CSS
stylesheet to work correctly. I loaded the following sample code
from the Adobe help files but the html text does not format
correctly? If I add a StyleSheet object , then it will format just
fine. The external CSS file is in the same directory as the SWF
file and I'm not getting any error messages. Using IE7 and Flash
Player 9.0.115....Any help would be much appreciated.

you can use something like the following to make your code
more eyeball friendly:

How can I convert external CSS to all be defined in page?

I need to move all CSS to be defined in the head of the page. Is there an easy way to do this with DWCC?

In the external file, hit Ctrl + A to select all, then Ctrl + C to copy it to your clipboard. Add a <style> </style> tagset to your <head> section and hit Ctrl + P to paste it between them. I Know DW can externalize css, but I don't think there's a function to go the other way.
Generally speaking, it's far better to use an external css file than it is to use embedded css though. Is there any particular reason you want to move it all?

Edge Animate 1.0 and external css

Hello and Happy Friday All,
I'm having issues getting an external css to work inside my Edge Animate project.
I'm importing the css like so on the compositionReady area of the stage actions:
$("<link/>",{"rel":"stylesheet", "type":"text/css", "href":"mmt_stylesheet.css" }).appendTo("#Stage");
My css is in the same directory as the rest of my edge files.
In my css file I have things written like so:
#Stage_#testing {
font-color: rgba (255,255,255,0.6)!important;
#Stage_#testing2 {
background-color: #0F0 !important;
width: 600px !important;
In my edge file I have one text file on the stage with the instant name of testing and a symbol of a simple rectangle with the instant name of testing2.
I am not seeing any styling when I previw the edge project. Any help would be much appreciated. Thanks

IE 10 - Sorry but I am new to this and do not know what you mean by "prefixes"
I have also tried this in Chrome and Firefox and the jpg does not load.
Do you know of another way of doing this? I thought it would be easy in Animate but it just seems very complex.
If I do this in a HTML page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="mmt_stylesheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="earth"></div>
</body>
</html>
With a css file of
@charset "utf-8";
/* CSS Document */
#earth {
width: 100px;
height: 100px;
background: url(http://www.noirextreme.com/digital/Earth-Color4096.jpg);
border-radius: 50%;
background-size: 210px;
box-shadow: inset 16px 0 40px 6px rgb(0, 0, 0),
inset -3px 0 6px 2px rgba(255, 255, 255, 0.2);
animation-name: rotate;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-timing-function: linear;
@keyframes rotate {
from { background-position-x: 0px; }
to { background-position-x: 210px; }
This works fine in all browsers - add this to Edge and it does not work.

External CSS styles to show up in WYSIWYG editor in admin section

Can anyone tell me how to get my external CSS styles to show up in the WYSIWYG editor of the admin section?

Hello RoosterInk, Within your Partner Portal go to Tools > Online Editor Settings. From here you should be able to add CSS to the online Editor. Hope this helps, Chad Smith | http://bcgurus.com/Business-Catalyst-Templates for only $7

CssRules for external css

Hi,
I try to add styles to combo in Rich Text Editor and after that RTE stop working.
After some debuging I find out that browsers like Firefox and Chrome don't allow to call cssRules on external css files and this java script fails, it cause that rte don't work.
Thanks,
Bartek

The enhancement request is in place to support external resources.
As a workaround overlay richtext.js and modify to [1].
[1]
try{
rules = styleToCheck.cssRules;
ruleCnt = rules.length;
catch(err){
ruleCnt=0;

Frustrated with external css link

I had an external css link that was working in edge version 2014.0, then I upgraded to 2014.1 and edge will no longer link to the external css link that it would before. (The reason I have an external css is that I have some elements that I am adding thru javascript to the stage later so that I don't clutter up the stage - these elements added later were then styled with my external css but now it doesn't work). I was able to get the css to link before by manually adding the css in the edge_Preload.js:
aLoader = [
      { load: "edge_includes/jquery-2.0.3.min.js"},
      { load: "edge_includes/edge.4.0.0.min.js"},
      { load: "js/rollarCoasterQuestionsMain.js", user: true },
      { load: "js/rollarCoasterQuestion1.js", user: true },
      { load: "js/rollarCoasterQuestion2.js", user: true },
      { load: "js/rollarCoasterQuestion3.js", user: true },
      { load: "js/rollarCoasterQuestion4.js", user: true },
{ load: "css/rollarCoasterQuestionsMain.css"},                 //this was the added line that worked before
      { load: "js/jquery.cookie.js", user: true },
      { load: "rollarCoasterR1_edge.js"},
      { load: "rollarCoasterR1_edgeActions.js"}];
It no longer works allowing me to add the external stylesheet this way... so I'm looking for a new way but going through the forum I've found the following examples that I haven't gotten to work:
Putting this in the stage code (technically is in the edgeActions.js file): sym.$("<link rel='stylesheet' type='text/css' href='css/rollarCoasterQuestionsMain.css'>").appendTo("#Stage");   //couldn't get this to work
Then tried putting this in my external javascript file just to try it another way but it diddn't work either (in my js/rollarCoasterQuestionsMain.js file):
$( "#Stage" ).append( "<link rel='stylesheet' type='text/css' href='../css/rollarCoasterQuestionsMain.css'>" );   // but this didn't work either
Please help

Actually in most of my Edge projects I'm using webfonts.
When doing this I also add an external stylesheet like below. (Located in the library, fonts tab)
Once done the stylesheet works too, without any other coding.
I hope this helps.
Kind regards,
Lester.

External CSS for infopath forms in browser not working

Hi everyone,
I'm going to develop many forms using Infopath 2013 and then deploy to Sharepoint Server 2013. Because of UI requements, I need use css to accomplish this. I create external css files so I can reuse them easily. I followed this steps:
Add css as resource file.
In .xsl file, add <link> which references to css file
Save manifest.xsf file and deploy.
In Infopath designer, it works well. But when I deploy to Sharepoint Form Library, these css is not applied anymore.
Could you please help me.
Thanks for your time and considerations.
Dang Huynh

You are previewing the *.dwt file? Make sure you have Preview
with temp
files enabled in your preferences.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"Sean022" <[email protected]> wrote in
message
news:g7mhro$64a$[email protected]..
> Hi,
>
> I have built a website page which was all fine until I
added editable
> regions
> and turned it into a template. Now when I try previewing
in Internet
> Explorer
> it comes up with a File download window asking 'Do you
want to download or
> save
> this file?'. Anyone know what is going on?
>
> Many thanks,
> Sean
>

External CSS override

What is the best way to apply an overriding style to a page
that already has an external CSS attached? My link style is 11pt.
on the external CSS, but on a few pages, I would like links to be
12pt. I don't want to create conflicts, I just want to do this
cleanly. I believe it's possible to do it with a different "level"
of CSS, taking advantage of the "cascading" properties of CSS.
This page will show an example of what I'm talking about.
http://www.campli-lo-li.com/test/Calendar/Certifications&Training.htm
I want the links on the left to be 11pt. but the e-mail links
in the body text to be 12pt.
Thanks in advance for your suggestions.
jeff

You don't want to use points on the web anyhow. Use pixels,
ems, ens, exs,
percents, or font size names - all of which are for pixel
based displays.
The simple way would be to add an embedded stylesheet (or a
linked one)
*after* the current one. When there is a conflict, the later
one will
override the earlier one (all other things being equal).
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"darcyfan" <[email protected]> wrote in
message
news:e1roln$k3m$[email protected]..
> What is the best way to apply an overriding style to a
page that already
> has an
> external CSS attached? My link style is 11pt. on the
external CSS, but on
> a
> few pages, I would like links to be 12pt. I don't want
to create
> conflicts, I
> just want to do this cleanly. I believe it's possible to
do it with a
> different "level" of CSS, taking advantage of the
"cascading" properties
> of CSS.
>
> This page will show an example of what I'm talking
about.
>
http://www.campli-lo-li.com/test/Calendar/Certifications&Training.htm
>
> I want the links on the left to be 11pt. but the e-mail
links in the body
> text
> to be 12pt.
>
> Thanks in advance for your suggestions.
>
> jeff
>

External CSS loading problem

This my hole code
AS3 code:
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.load(new URLRequest("linkNewD.xml"));
var cssLoader:URLLoader = new URLLoader();
cssLoader.load(new URLRequest("style.css"));
cssLoader.addEventListener(Event.COMPLETE, onCSSFileLoaded);
function onCSSFileLoaded(event:Event):void
var st:StyleSheet = new StyleSheet();
st.parseCSS(cssLoader.data);
trace(cssLoader.data);
myMc1.opt1txt.styleSheet =st;
When I am trace this (trace(cssLoader.data);) I got this css
".a {color: '#6a4100', text-decoration: 'none';}
.a:link { color: '#333333', textDecoration: 'none'; }
.a:hover {color: '#b30000', text-decoration: 'none';}"
but not Appling to the test field why?
xmlLoader.addEventListener(Event.COMPLETE, displayHTML);
function displayHTML(e:Event):void {
var xmlData:XML = new XML(e.target.data);
myMc1.opt1txt.htmlText = xmlData.Header1.option.*;
External CSS code:
.a {color: '#6a4100', text-decoration: 'none';}
.a:link { color: '#333333', textDecoration: 'none'; }
.a:hover {color: '#b30000', text-decoration: 'none';}
XML code:
<data>
<Header1>
<title>Title one</title>
<option>
<![CDATA[<b>Option Title</b><br>]]>
<![CDATA[<a href="http://www.google.com">Google Search</a><br>]]>
<![CDATA[<a href="http://www.yahoo.com">Yahoo Search</a><br>]]>
<![CDATA[<a href="http://www.bing.com">Bing search</a>]]>
</option>
</Header1>
</data>
Please help me!
Thanks,
jafy

Hi jafy,
Please make your textfield dynamically using as3. Now your CSS is correct but you created the textfield by manual… it’s automatically add styles and other html code on textfield
While I was using manually crated textfield… I trace the html text content from textfield it was showing like:
<TEXTFORMAT LEADING="2">
     <P ALIGN="CENTER"> <FONT FACE="Arial" SIZE="16" COLOR="#000000" LETTERSPACING="0" KERNING="0"><B>Option Title</B></FONT> </P>
</TEXTFORMAT>
<TEXTFORMAT LEADING="2">
     <P ALIGN="CENTER"> <FONT FACE="Arial" SIZE="16" COLOR="#000000" LETTERSPACING="0" KERNING="0"> Google Search</FONT> </P>
</TEXTFORMAT>
<TEXTFORMAT LEADING="2">
     <P ALIGN="CENTER"> <FONT FACE="Arial" SIZE="16" COLOR="#000000" LETTERSPACING="0" KERNING="0"> <A HREF="http://www.google.com" TARGET="">Google Search</A> </FONT> </P>
</TEXTFORMAT>
<TEXTFORMAT LEADING="2">
     <P ALIGN="CENTER"><FONT FACE="Arial" SIZE="16" COLOR="#000000" LETTERSPACING="0" KERNING="0"> <A HREF="http://www.yahoo.com" TARGET="">Yahoo Search</A></FONT></P>
</TEXTFORMAT>
<TEXTFORMAT LEADING="2">
     <P ALIGN="CENTER"><FONT FACE="Arial" SIZE="16" COLOR="#000000" LETTERSPACING="0" KERNING="0"> <A HREF="http://www.bing.com" TARGET="">Bing search</A></FONT></P>
</TEXTFORMAT>
Now I rewrite your as3 code and added that here:
var cssLoader:URLLoader = new URLLoader();
cssLoader.load(new URLRequest("style.css"));
cssLoader.addEventListener(Event.COMPLETE, onCSSFileLoaded);
function onCSSFileLoaded(event:Event):void {
    var st:StyleSheet = new StyleSheet();
    st.parseCSS(cssLoader.data);
    var xmlLoader:URLLoader = new URLLoader();
    xmlLoader.load(new URLRequest("linkNewD.xml"));
    var opt1txt:TextField = new TextField();
    opt1txt.styleSheet=st;
    myMc1.addChild(opt1txt);
    xmlLoader.addEventListener(Event.COMPLETE, displayHTML);
    function displayHTML(e:Event):void {
        var xmlData:XML=new XML(e.target.data);
        opt1txt.htmlText=xmlData.Header1.option.*;
        //trace(myMc1.opt1txt.htmlText);
        opt1txt.autoSize = TextFieldAutoSize.LEFT;
CSS Code:
p{font-size: 25px; color:#ffcc00;}
a {color: #6a4100; text-decoration:none;}
a:link { color:#333333; text-decoration:none; }
a:hover {color:#ff0000; text-decoration:none;}
Regards,
Finoy Francis.
http://flashprolabs.com

External CSS to add banner to mulitple topics

Similar Messages

Maybe you are looking for