Mapbuiler.net Text Color?

Bubba Bob

By Bubba Bob,
in Website Design & SEO Help

 Share Followers 0

Recommended Posts

Bubba Bob

Bubba Bob

Posted
Posted (edited)

Hopefully someone here is familar with Mapbuilder.net. For some reason the text color on my maps is a real light blue. too light to read. The text mentioned is bolded in the quote below. If someone could read over that section and tell me how to change that text color Id greatly appreciate it. Or if someone knows a way to do it with Mapbuilder's GUI editor.

Also, I already tried HTML tags. Didnt quite work :blush:

Thanks yall.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8"/>

<title>DivingNutz</title>

<meta name="title" content="MapBuilder - GoogleMap API Source Code Generator." />

<meta name="description" content="MapBuilder.net lets you tag locations on a map and publish it on your own site. Mapping is now easier than ever. It's free." />

<meta name="keywords" content="Google Maps API, PHP, AJAX, XML" />

<meta name="author" content="Andrew Bidochko. http://www.mapbuilder.net" />

<style type="text/css">

/* Generic map, side bar holder styles */

.MapBuilder {font: normal small verdana, arial, helvetica, sans-serif; font-size: 10pt; margin: 0px;}

.MapBuilder a {text-decoration: none; color: #000000; background-color: transparent;}

.MapBuilder a:hover {color: #F60; background-color: transparent;}

.MapBuilder h1 {font-weight: bold; font-size: 16pt; color: #000000; border-bottom: 2px solid #369;}

/* Info Window styles */

.IW { width: 350px;}

.IWContent {height: 120px; overflow:auto;}

.IWCaption {font-weight: bold; font-size: 12pt; color: #369; border-bottom: 2px solid #369;}

.IWFooter {margin-top: 5px; font-size: 8pt; }

.IWFooterZoom {}

.IWDirections{background-color:#FFF;}

.MapBuilderSideBar {float:left; margin-left: 10px; }

</style>

<!-- Please, request sign up for your own GMAP KEY at http://www.google.com/apis/maps/signup.html and replace 'GMAPKEY' entry with generated key in the line below. -->

<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAxD2sHTTCC5qJBiqRraeN_BSQEafI61nDT5uivlKK6FxSLyogTBQeNOjeh_srR-Cd8qqAAfHie213Sg" type="text/javascript"></script>

<script src="http://www.mapbuilder.net/js/api/google/v2.03/?UserName=americanmadeford&Map=48600&SideBar=Right" type="text/javascript"></script>

<script type="text/javascript">

//<![CDATA[

// Global Variables

// set map variable

var map = null;

//set up array of locations

var aLocations = new Array;

/*************************** Configuration Options ***************************/

/*PDMarker is used to display tooltips when the user hovers over the markers.

* PDMarker is a LGPL library provided by Peter Jones.

* For details see http://wwww.pixeldevelopment.com/pdmarker.asp

*/

var usePDMarker = false;

// Create a base "tiny" red icon that specifies the shadow, icon dimensions, etc.

var iconsm = new GIcon();

iconsm.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";

iconsm.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";

iconsm.iconSize = new GSize(12, 20);

iconsm.shadowSize = new GSize(20, 18);

iconsm.iconAnchor = new GPoint(6, 20);

iconsm.infoWindowAnchor = new GPoint(5, 1);

// Create a base "large" red icon that specifies the shadow, icon dimensions, etc.

var iconbig = new GIcon();

iconbig.image = "http://www.google.com/mapfiles/marker.png";

iconbig.shadow = "http://www.google.com/mapfiles/shadow50.png";

iconbig.iconSize = new GSize(20, 34);

iconbig.shadowSize = new GSize(37, 34);

iconbig.iconAnchor = new GPoint(6, 34);

iconbig.infoWindowAnchor = new GPoint(5, 1);

// Custom Icon

var iconcustom = new GIcon(iconbig);

iconcustom.shadow = '';

function onLoad() {

if (!GBrowserIsCompatible())

{

document.getElementById("MapBuilderMap").innerHTML = "Unfortunately your browser doesn't support Google Maps.<br /> To check browser compatibility visit the following <a href=\"http://local.google.com/support/bin/answer.py?answer=16532&topic=1499\">link</a>.";

return;

}

map = new GMap2(document.getElementById("MapBuilderMap"));

var MB = new MapBuilder(map);

map.addControl(new GLargeMapControl());

map.addControl(new GMapTypeControl());

// Center the map to the default location and set map type

map.setCenter(new GLatLng(30.89279747750818, -85.133056640625), 6, map.getMapTypes()[0]);

// Initialize variables

var point = null;

var footerHtml = null;

var InfoHTML = null;

var marker = null;

/* Options used for PDMarker initialization:

* label: tooltip text

* opasity: tooltip opasity

*/

var options = {};

// Add locations

point = new GLatLng(30.65779386937264, -85.90391278266907);

footerHtml = "<div class=\"IWFooter\"><div class=\"IWFooterZoom\"><a href=\"java script:void(0)\" onclick=\"ZoomMapTo(0)\">Zoom To</a></div></div>";

// Define Marker

InfoHTML = "<div class=\"IW\"><div class=\"IWCaption\">Morrison Springs</div><div class=\"IWContent\"><P>EXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXT.</P></div>" + footerHtml + "</div>";

iconbig.image = "http://www.mapbuilder.net/img/icons/marker_34_blue.png";

marker = createMarker(point, InfoHTML, iconbig, options, 0);

map.addOverlay(marker);

aLocations[0] = new Array(marker, "Morrison Springs", InfoHTML, point);

point = new GLatLng(30.126124364224577, -85.73387145996094);

footerHtml = "<div class=\"IWFooter\"><div class=\"IWFooterZoom\"><a href=\"java script:void(0)\" onclick=\"ZoomMapTo(1)\">Zoom To</a></div></div>";

// Define Marker

InfoHTML = "<div class=\"IW\"><div class=\"IWCaption\">St Andrews St Park</div><div class=\"IWContent\"><P>EXAMPLE TEXT EXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXTEXAMPLE TEXT </P><br /><P>Dive flags are required and needed. Be carefull of the fishing lines cast near the rocks. Cary a dive tool!</P></div>" + footerHtml + "</div>";

iconbig.image = "http://www.mapbuilder.net/img/icons/marker_34_blue.png";

marker = createMarker(point, InfoHTML, iconbig, options, 1);

map.addOverlay(marker);

aLocations[1] = new Array(marker, "St Andrews St Park", InfoHTML, point);

// And finnaly create sidebar

createSideBar();

}

//]]>

</script>

</head>

<body onload="onLoad()" onunload="GUnload();">

<div id="MapBuilder" class="MapBuilder">

<h1>DivingNutz</h1>

<p>Local SE USA Scuba Site</p>

<div id="MapHolder" class="MapHolder" style="float:left;">

<div id="MapBuilderMap" style="width: 600px; height: 500px;"></div>

<!-- Please KEEP RESPECT to MapBuilder.net team and DO NOT DELETE line below if you want to keep MapBuilder service free. -->

Created by <a href="http://www.MapBuilder.net">MapBuilder.net</a>.

</div>

<div id="MapBuilderSideBar" class="MapBuilderSideBar">

<div id="SideBarAction">Map Locations [<a id="SideBarActionLink" href="java script:void(0)" onclick="ProcessLocationList()">-</a>]</div>

<div id="LocationList" style="height: 480px; overflow:auto;"></div>

</div>

</div>

Edited by Bubba Bob
Link to post
Share on other sites
Bubba Bob

Bubba Bob

Posted
  • Author
Posted

Thanks Mike,

Im just the web"master". May be a picture of me in the photo gallery. Dunno.

ON a side note, I figured it out. Although, I have to manually insert the font folor tags. Seems like that should be a feature in the GUI. Google, you've let me down <_<

Link to post
Share on other sites
  • 2 weeks later...
Dragon

Dragon

Posted
Posted

in this section of the stylesheet code you can change the info.

/* Info Window styles */
.IW { width: 350px;}
.IWContent {height: 120px; overflow:auto;}
.IWCaption {font-weight: bold; font-size: 12pt; color: #369; border-bottom: 2px solid #369;}
.IWFooter {margin-top: 5px; font-size: 8pt; }
.IWFooterZoom {}
.IWDirections{background-color:#FFF;}

Particularly the .IWCaption section. change the color from #369 to whatever hex code you would prefer for the color to be. You would only need to change the first #369 for the text color.

Link to post
Share on other sites
Dragon

Dragon

Posted
Posted

Just remember, when you have a stylesheet that is what controls the colors, size, etc..

If you are using a template, look at the div id tag to determine which stylesheet command you need to work on.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
 Share
Followers 0
Go to topic listing