Search jQuery

jQuery Forum

jQuery Mobile

fgcaipe

how to add new jqueryMobile from themeroller???

in jQuery Mobile • 8 years ago

I've made a new theme for my phonegap+jQueryMobile app with themeroller for my jquerMobile version 1.2.1

I've downloaded the zip , and I've followed the instructions that are:

Add theme folder to your project and then include this before jquery files

But It doesn't work at all...

How can I get it????

Thanks!

Replies(11)

haga0054

Re: how to add new jqueryMobile from themeroller???

8 years ago

If it doesn't work... you are obviously doing something wrong. Post the entire <head> of your document not just the one link; that is pretty useless information.

fgcaipe

Re: how to add new jqueryMobile from themeroller???

8 years ago

<head>
<title>Rostelería</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="themes/mytheme.min.css" />
<link href="css/estilo.css" type="text/css" rel="stylesheet" />
<link href="css/styles.css" type="text/css" rel="stylesheet" />
<link href="jquery.mobile/jquery.mobile-1.2.1.min.css" type="text/css" rel="stylesheet"/>
<link href="css/photoswipe.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="css/jqm-datebox.min.css" />
<script src="jquery.mobile/jquery-1.8.3.js"></script>
<script src="jquery.mobile/jquery.mobile-1.2.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/cordova.js"></script>
<script type="text/javascript"src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="js/jqm-datebox.core.min.js"></script>
<script type="text/javascript" src="js/jqm-datebox.mode.calbox.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile.datebox.i8n.es.js"></script>
<script type="text/javascript" src="js/jqm-datebox-1.1.0.mode.flipbox.js"></script>
<script type="text/javascript"src="js/index.js"></script>
</head>

Obviously I've checked the url of the css and it's ok ;)

haga0054

Re: Re: how to add new jqueryMobile from themeroller???

8 years ago

You did not follow the instructions :-(. I don't know where you saw that all you had to do was include the css file but that's flat out wrong. You need to replace the JQM CSS file with the JQM-Structure CSS file.

fgcaipe

Re: how to add new jqueryMobile from themeroller???

8 years ago

I've copied all the content of mytheme.min.css and past it on jquery.mobile-1.2.1min.css, but it looks wrong structured. What can I do? I'am using the right version of jqueryMobile in the selector of themeroller...

[URL=http://www.subirimagenes.com/imagen-pantallazo-8500933.html][IMG]http://s2.subirimagenes.com/imagen/previo/thump_8500933pantallazo.png[/IMG][/URL]

haga0054

Re: Re: how to add new jqueryMobile from themeroller???

8 years ago

What? Why would you do that. All you needed to do was replace the jquery.mobile/jquery.mobile-1.2.1.min.css file with the jquery.mobile/jquery.mobile-structure-1.2.1.min.css file. You should have a copy of it with the downloaded theme.

fgcaipe

Re: how to add new jqueryMobile from themeroller???

8 years ago

http://www.subirimagenes.com/imagen-pantallazo-8500933.html

haga0054

Re: Re: how to add new jqueryMobile from themeroller???

8 years ago

Again, why are you pasting it in the jquery mobile css? That is incorrect. Include your theme.css as you have above but REPLACE the jquery.mobile-.1.2.1.min.css file with a file called jquery.mobile.structure-.1.2.1.min.css that was in the downloaded zip file for the theme. Read the instructions and follow the example included.

fgcaipe

Re: how to add new jqueryMobile from themeroller???

8 years ago

First of all , I'm sorry, I've been working for a lot of hours and I didn't understand you before...

but now I thing I got it...

But the file jquery.mobile.structure-.1.2.1.min.css is not in the zip I've downloaded from themroller, I've founded it in the jqueryMobile 1.2.1 folder...

It looks better but It's still looking wrong, here is my theme from themRoller:

myTheme

And here the capture of my screen:

http://www.subirimagenes.com/imagen-pantallazo1-8500983.html

I also tried to avoid the other .css and theme are not the problem.

My head now, thx for all:

<head>
<title>Rosteleria</title>

<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />

<link rel="stylesheet" href="theme/myTheme.min.css" />
<link href="css/estilo.css" type="text/css" rel="stylesheet" />
<link href="css/styles.css" type="text/css" rel="stylesheet" />

<link rel="stylesheet" href="jquery.mobile/jquery.mobile.structure-1.2.1.min.css" />

<link rel="stylesheet" type="text/css" href="css/jqm-datebox.min.css" />

<script src="jquery.mobile/jquery-1.8.3.js"></script>
<script src="jquery.mobile/jquery.mobile-1.2.1.min.js"></script>

<script type="text/javascript" charset="utf-8" src="js/cordova.js"></script>

<script type="text/javascript"src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>

<script type="text/javascript" src="js/jqm-datebox.core.min.js"></script>
<script type="text/javascript" src="js/jqm-datebox.mode.calbox.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile.datebox.i8n.es.js"></script>
<script type="text/javascript" src="js/jqm-datebox-1.1.0.mode.flipbox.js"></script>

<script type="text/javascript"src="js/index.js"></script>

</head>