QWebView & external css file

**folibis** · 27th November 2013, 02:17

I use QWebView as template editor in my app.
Structure of my project:

Qt Code:

Switch view

MyProject/
    app.exe
    Templates/
        style.css
        template.html

MyProject/
    app.exe
    Templates/
        style.css
        template.html

To copy to clipboard, switch view to plain text mode

This is simplified HTML code of template:

Qt Code:

Switch view

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<p>Some content</p>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<p>Some content</p>
</body>
</html>

To copy to clipboard, switch view to plain text mode

in same directory I have style.css:

Qt Code:

Switch view

html,body {
	font-family:Tahoma;
}

html,body {
	font-family:Tahoma;
}

To copy to clipboard, switch view to plain text mode

But QWebView ignores my styles. I guess it just can't load it.
Code for content loading:

Qt Code:

Switch view

QFile file(QApplication::applicationDirPath() + "/Templates/template.html");
QUrl url(QApplication::applicationDirPath() + "/Templates");
ui->textEdit->setHtml(file.readAll(),url);

QFile file(QApplication::applicationDirPath() + "/Templates/template.html");
QUrl url(QApplication::applicationDirPath() + "/Templates");
ui->textEdit->setHtml(file.readAll(),url);

To copy to clipboard, switch view to plain text mode

I tried

Qt Code:

Switch view

ui->textEdit->settings()->setUserStyleSheetUrl(url);

ui->textEdit->settings()->setUserStyleSheetUrl(url);

To copy to clipboard, switch view to plain text mode

and

Qt Code:

Switch view

QUrl url("file://" + QApplication::applicationDirPath() + "/Templates");

QUrl url("file://" + QApplication::applicationDirPath() + "/Templates");

To copy to clipboard, switch view to plain text mode

but nothing helps.
So how can I load local css file to QWebView?

**ChrisW67** · 27th November 2013, 04:42

Your code snippet does not open the file before trying to read from it, which may explain a blank display.

Why don't you simply:

Qt Code:

Switch view

webView->load(QUrl::fromLocalFile(QApplication::applicationDirPath() + "/Templates/template.html"));

webView->load(QUrl::fromLocalFile(QApplication::applicationDirPath() + "/Templates/template.html"));

To copy to clipboard, switch view to plain text mode

and let the browser find the styles based on the header link element?

BTW: Why have you given a QWebView the truly misleading name of textEdit?

**folibis** · 27th November 2013, 05:10

Thanks ChrisW67, you gave me hope to dig it one more time )
I changed setHtml() to load() and now it works fine. with all css files and page()->settings()->setUserStyleSheetUrl() works too.

At first it loads blank page just because my file was page.tpl and not page.html ))))))

Originally Posted by ChrisW67

BTW: Why have you given a QWebView the truly misleading name of textEdit?

Heh ... At first it was QTextEdit but it was not good for html editing. So I changed it to QWebView but all names remained )

**folibis** · 27th November 2013, 22:42

It is so strange ... now setHtml() works too. I mean load external css files etc.
It was problem with file extension. I just changed it from *.tpl to *.html and it works fine ))