I'm trying to monitor a small section of a web page for changes using the the Google Page Monitor extension --
https://chrome.google.com/extensions/detail/pemhgklkefakciniebenbfclihhmmfcd
Under advanced settings I can use either Regex or Selectors to accomplish this, but need help with this. In the following html, I'd like to monitor the following for changes in either the URL in line 4 or the text in line 5. Any pointers gratefully accepted.
<div id="rtBtmBox"><div id="sectHead" style="margin-bottom:5px;">
<h3>SLJ's Pick of the Day</h3></div>
<p align="center">From the March issue</p>
<p align="center"><a target="_blank" href="http://www.schoollibraryjournal.com/article/CA6723937.html">
<font color="#0000ff"><strong><em>The Summer I Turned Pretty</em></strong><br/>
Awesome, to find a question about my own extension on the front page of StackOverflow.
Anyway, it's easier using a selector. This should do the job: #rtBtmBox p:nth-child(3). However, if that paragraph has more contents, you might need something different (post or link the whole page if so).
A regex that will probably work is: <div id="rtBtmBox">[^]*?<a target="_blank" href="([^"]+)"
Related
I need to improve the accessibility of my websites in line with UK Legislation. Google Lighthouse reports that the aria-selected=”true” attribute is invalid in the following snippet:
<a class="aJHbb dk90Ob jgXgSe HlqNPb" jsname="QwLHlb" role="link" tabindex="0" aria-selected="true" href="/home" data-url="/home" data-type="1" title="Home" jsaction="keydown:mPuKz; click:vHQTA;" data-level="1">Home</a>
This error occurs across the site navigation for selected menu items. Please advise on a way to fix this issue within the template I am using for my site.”
The W3C spec reports that the attribute aria-selected can be used with the following roles:
gridcell
option
row
tab
Your element has a role of link, which is not included in the list.
You can use aria-current="page" instead. Here is the spec.
I'm diving in to Orchard CMS and ASP.NET MVC, and could do with a little help. I am consuming an RSS feed that consists of HTML -a link around an image- that I want to keep, followed by some text that I don't want.
Eg:
<img src="http://media-cache-ec3.pinterest.com/upload/65935582014430387_d5ueoRR6_b.jpg">Nice graphic design & typography
I figure the best way to do this is use a regex to detect the required HTML. However I don't have much experience of regex formatting, nor do I know how I should go about implementing the regex within my scenario. The code below is what I'm currently working with:
#using System.Xml.Linq
#{
var feed = Model.Feed as XElement;
}
<ul>
#foreach(var item in feed
.Element("channel")
.Elements("item")
.Take((int)Model.ItemsToDisplay)) {
<li>#T(item.Element("description").Value))</li>
}
</ul>
So, I essentially have two questions (with no1 being the most important):
How should I implement a regex to lose the unwanted free text
What would the regex be that I need to do this
I dealt with this using css to hide the text.
Ive got the following code in my RSS consumer (Vandelay Industries RemoteRSS) in my Orchard CMS implementation:
#using System.Xml.Linq
#{
var feed = Model.Feed as XElement;
}
<ul>
#foreach(var item in feed
.Element("channel")
.Elements("item")
.Take((int)Model.ItemsToDisplay))
{
<li>#T(item.Element("description").Value)</li>
}
</ul>
The rss feed Im using is from Pinterest, and this bundles the image, link, and a short description all inside the 'description' elements of the feed.
<description><a href="/pin/215609900882251703/"><img src="http://media-cache-ec2.pinterest.com/upload/88664686384961121_UIyVRN8A_b.jpg"></a>How to install Orchard CMS on IIS Server</description>
My issue is that I don't want the text bits, and I also need to prefix the 'href=' links with 'http://www.pinterest.com'.
I've managed to edit the original code with my newbie skills to the above,, which essentially displays the images as links which are only relative and thus pointing locally to my server. These images are also then followed by the short description.
So to summarise, I need a way to prefix all links with 'http://pinterest.com' and then to remove the fee text after the image/links.
Any pointers will be greatly appreciated, Thanks.
You should probably parse the description, with something like http://htmlagilitypack.codeplex.com/, and then tweak it to add the prefix. Or you can learn regular expression and do without a library. Could be a little trickier and error-prone however.
I'm building a Yahoo! Pipe to pull an RSS feed from Reddit which links to some content in the description. I'm using a regex to match the href attribute of the anchor link in an item.description field. The regex I'm using is:
^.+?href="([^"]+)">\[link\].+?$
As a test, I set the replace to simply:
$1
and I see that the entire description field has been replaced with the URL. So far, so good.
I then put the following in the replace field. The idea being to iframe the content that's linked to:
Content: <iframe src="$1">no iframe support</iframe> End
What I get out however is:
Content: no iframe support End
I've confirmed that this is also coming through in the pipe's output and not just in the Yahoo! Pipes debug console.
I've so far tried replacing my angle brackets with < and > entities. I've tried wrapping the entire thing in a <![CDATA[ ... ]]> block and still, I get nothing. If I break my iframe tag by removing an angle bracket, the broken content comes through fine, but if I have a well-formed iframe element, it vanishes, leaving the "no iframe support" text. Am I doing something wrong here, or is Yahoo! actively preventing me from using iframe tags in my generated pipe? A cursory search on Google isn't turning up anything related to this.
The pipe in question is here:
http://pipes.yahoo.com/pipes/pipe.info?_id=2ba41448cadd2347d86f377efd3d199f
This Pipes FAQ Question "Why does Pipes Strip <object> and <embed> tags... ?" shows that a certain amount of sanitization is performed, by placing content (at least certain content) into an iframe for the safety of RSS consumers - though it does not state it specifically, this probably also removes other iframes in order to avoid nesting and other work-arounds.
Yahoo is big enough I would doubt they have a week sanitizer, but an extremely long shot is that you might be able to fool it by nesting the iframe in a bunch of other tags (again I doubt this will work). Also depending upon which step does the sanitization, perhaps adding part of the tag in one step, then adding another part somewhere else might work (yet again, doubt overwhelms me)
Not sure what else to suggest, other than getting something else to consume and transform your RSS a little bit more (by fixing otherwise broken tags??) - but that's what you're using pipes for to begin with, isn't it? Idunno...
Good luck!
Pipes has an fanatical devotion to the RSS spec and the spec says the description field is plain text only. HTML etc is supposed to go in the content:encoded field, not that I've had much luck getting pipes to do that.
I have seen in videos, that people get html template by typing "html:5" or something like that (btw, they're not using notepad++). Is this possible in notepad++? Thanks.
A little late, but what you're looking for is called Zen Coding.
The Zen Coding project hosted on Google has a plugin for NotePad++ that should do exactly what you need.
For example, entering something like:
html>head+body>div#content>ul.nav>li*5
Followed by Ctrl + E, expands into:
<html>
<head></head>
<body>
<div id="content">
<ul class="nav">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</body>
</html>
Now it's called Emmet plugin in Notepad++
Just type html:5 and press control + alt + enter
and you will get the following markup:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
Option 1
Install and use the Notepad++ Snippets plugin.
You can input whatever code snippet you want and give each snippet a name.
When you double-click on your snippet name, the snippet text just gets copied to your editor (before or after your cursor, based on how you set it)
Option 2
If you don't have admin access or behind a firewall, there is a Macro hack.
If your template is a bit short, then you can use the built-in MACRO and manually key in the template text (a one-time operation per template). You can then "Save Current Recorded Macro" and replay it for every new file that you create. Emmet works only for html, but this technique works for any kind of text(as long as you can manually key-in the text)
Note: You cannot copy-paste (Ctrl-C/Ctrl-V) text while recording as it will copy-paste current clipboard's contents which is undesirable!
For those who like step-by-step instructions:
Open Notepad++. Select Macro -> Start Recording.
Key-in your text (every key-stroke is now being recorded, so minimize backspaces and deletes)
Click : Macro -> Stop Recording
Click : Save Current Recorded Macro and give it a name (say "bash_header" or "html_structure")
Now click on your Macro name to repeatedly apply the template text to your notepad++ file.
Using NP++v6.1.4, I got this to work pretty quickly doing this:
Choose Plugins -> Plugin manager -> Show plugin manager
Wait for all the plugins to be shown, and check the box Emmet
It may alert you that Python will also be installed
Once it completes its installation, allow NP++ to be restarted, and now you can use the many Emmet features :)
Now, just type ! and hit ctrl-alt-enter.
You can use QuickText to create your own templates. It seems that QuickText isn't supported anymore, but it still works, the documentation just has some wrong content.
I use a program called Ditto, it's like a clipboard of all your copy-paste material. I have my prewritten syntax in there pinned. It helps.
In actuality, it is called marking up your code. Although "zen coding" is becoming well known in place of markup, it is the original term for building a structure for your code; which makes it easier for others to read.
As far as the template thing goes for Notepad++, I'm afraid that it is difficult to find public, custom made templates. Although the program does come with custom made templates, such as the Hello Kitty template, your best bet would be to ask people in online programming communities.
My personal favorite is DreamInCode, where they offer help and support, as well as pretty informative tutorials on numerous different computer programming and web development languages. I'm confident that if you can't find one you like that has been posted there, if any, someone would be glad to help you.